Header menu overlaps content

Support
#1

Hey there,
my header overlays the content on some pages. The header is great the way it is and would like to apply the same header on every page. Now I need some advice or a css that I can apply to pages with this problem: http://prntscr.com/mwtktm so the header is added before the page content. So NO second header that is applied to subpages

thank for your help!

#2

Hi @zerotoone.de,

Try adding a body class to the pages where you want the content to be pushed below the header area then add a custom CSS like this:


.with-top-margin {
    margin-top: 30px;
}

Feel free to change the value of the top margin accordingly.

Hope this helps.

#3

Thank you, but this just pushed down the whole page http://prntscr.com/mxnufn

#4

Hi @zerotoone.de
,
We could try another approched.

For pages where you don’t want your header to overlap, you can add this in Cornerstone > CSS

.x-bar-absolute {
    position: static;
}

Hope that helps

#5

thank you but this just fixes my menu,
all I’d like to achieve is the same menu behavior I already got, and just the content on certain pages pushed down, so the menu does not overlap text when opening up a page

#6

Hi @zerotoone.de,

In that case, you can try this code instead,

.x-main {
     padding-top: 100px;
}

Add it in Cornerstone > CSS only for pages where you want to push your content

Hope this helps

1 Like
#7

I’am on pro, but this seems to work

#8

Thanks for letting us know that it has worked for you.

1 Like
#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.