[Resolved] Header / Hero Image wont show full width

[Ben]

Hi there

I have a similar problem but the CSS code you provided for another member does not work for me.
– however, it does make the LOGO immediately go to 100% but not the background image! 🙂

I’m using the SERVICE theme from the Site Library on http://www.theseoguy.co.nz

The background image is currently 1920x900px
Container is set to Full, as is Inner Container
Image size: full
Size = cover

I’ve read all the related Topics, and after hours of trying not to accept defeat, I’m finally forced to ask for help on this. 🙂

Site is on Cloudflare: I’ve “paused” it and cleared the cache.
– also uses WP Rocket cache but that is Off for logged in users….

GP: latest versions working for theme and plugin

Kind regards
Ben

[Elvin]

hi there,

You have this CSS on your site.

#content {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

The max-width prevents the content area from going full width.

I believe you’re aiming for something like this?
https://share.getcloudapp.com/JruDK1gX

If you wish to keep your current layout but for the container block to go full width of the viewport, set the container block’s alignment to full width as shown here – https://share.getcloudapp.com/geug54qK

[Ben]

Hi Elvin

Clearly, you are a genius… and the Container “Alignment” option was the only place I did not look!!!
– It never occurred to me the it does more than “left, right and centre” on a container… 🙂

Thanks so much – your help is greatly appreciated.

Kind regards
Ben

[Elvin]

No problem. glad to be of any help. 😀

[Author]

Posts