Full width image attached to header on inside page

[Jeroen van Aerle]

Hi Bill,

Like you explaned in a former topic, I have placed an image below the header on an ‘insite page’.

image under header stretching across the screen on full width pages

1. The image doesn’t stretch over the full width of the screen, how can this be done?

And, how can I fix the image to the header like on this page?:
http://kinkhao.com/reservations.html

Cheers,
Jeroen

[Bill Robbins]

Good Morning Joren,

You can make the image always full width, even on large displays. Here’s how to do that:

1. Go to your theme options page and choose the Advanced tab.
2. Scroll down to the Custom CSS box and add this:

   
   .page img.large-banner {
   	width: 100%;
   }
   

3. Update your settings.

There isn’t any easy way to create the effect from the other site here though. Basically the image there is a background image that’s fixed in place. The content is in a separate container with a colored background so that as the page is scrolled, it covers up the header. The structure just isn’t set up here for that to work. Sorry about that.

Take care,
Bill

[Author]

Posts