[Resolved] Cannot make full width hero images

[Evan]

I am trying to get my hero images to be the full width of the browser window. I have set up the page hero element, and set the Container to full width. It all makes sense, but the image just doesn’t show full width.

This is an example page:

https://mountainmotel.net/contact/

thanks for any help you can offer.

mark

[Leo]

Hi there,

Try this CSS:

.featured-image.page-header-image.grid-container {
    max-width: 100%;
}

Make sure your image is at least 2000px in width. Otherwise, it would look like this on a 1080p screen:
https://www.screencast.com/t/989cVQvscq

[Evan]

Works perfectly, thank you.

mark

[Leo]

No problem 🙂

[Author]

Posts