[Resolved] Let content appear right under the translucent menu

[Eric]

Hi everyone,

I’d like to let my content appear directly under my slightly translucent header throughout the website. For instance on this page (work in progress) basically I would like to have the image start 60px higher underneath the menu.

I’ve played around with the css quite a bit buy I’m not sure how to do it.

Any help is very welcome 🙂

Best regards,

Florian

GeneratePress 1.3.44

GP Premium 1.2.94

[Leo]

Hi Florian,

Not quite sure what you meant..Are you wanting the top image to overlap the main menu which is 60px in height?

Let us know.

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

[Eric]

Hi leo,

I’m sorry I wasn’t clear. Basically what I want is this: I have a slightly transparent menu bar that is 60 px high. But only when you scroll down you can see the image behind the menu bar, while I like to have the image start at the top of the page right under the menu bar. So when you open the page you can slightly see the image through the menu bar. I hope this is clear…

Best regards,

Florian

[Leo]

Can you try if this works? https://docs.generatepress.com/article/merging-header-navigation-content/

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

[Leo]

Nevermind I don’t think that will give you the look you wanted…Will ask Tom to have a look 🙂

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

[Tom]

Maybe try this:

#site-navigation {
    position: fixed;
    width: 100%;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Eric]

Yes that did the trick, thanks a lot!

[Tom]

You’re welcome 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts