I guess you're talking about the Thakeham Table Tennis website?

The banner area in the Bootstrap theme will try to ensure that the image always fills the space - it's intended more for a background style image rather than a logo. However if you provide a banner image of the 'perfect' size it should do the job just fine!

The key here if using a banner image I think would be to note that when the browser is at full width, the banner area is 1140x120 pixels.

So if your banner image has a taller aspect ratio than this, then it'll be cropped top and bottom at this size.

So you could try providing a banner image of this size, or you could tweak the CSS to make the banner area a bit taller. Something like this added to the Extra Header HTML might do it:

<style>
#banner-inner {
  min-height: 140px;
}
</style>

Hope this helps!

I see you're also dabbling with the Background Image includelet. Similar to the banner image, this will always try to fill the image into the space, so you'll find that the top/bottom or sides may be cut out depending on the width of the browser.

If you want to have a fixed aspect ratio you can do this in the includelet settings, though you may then find that any overlaid text is lost at narrower browser widths. If so, you can just unset the aspect ratio for the background image and it'll always be as tall as necessary for the text to fit in.

Cheers

Joe