[Support request] Offset site header height

[Terence]

At the Unlevel site I am trying to set up the first section of the homepage to “fit to screen”, but its too long and the problem I think I am having is that I am not allowing for offset site header height. How do I do that?

[David]

Hi there,

you could use the Header Element and set the Site Header to merged, but as you’re using Elementor probably easier to use some CSS. Edit the Elementor Section > Advanced Tab > CSS Classes and give it a custom class e.g: full-height-hero

Then add this CSS:

@media (min-width: 768px) {
    .full-height-hero {
        height: calc( 100vh - 60px );
    }
}

The 60px is the height of the nav

May need to give that property some !important

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Terence]

More strangeness David. It didn’t seem to be making any difference and then I added the !important and Bob’s your uncle. Perfect. Thanks!

[David]

Glad to be of help.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts