I created a custom header and everything works fine, accept for on mobile (portrait mode). For some reason all the content of a post/page snaps to the top under the header when on mobile (portrait mode). On the link below you can see what I mean.
https://vimeo.com/user33093694/review/334304796/5c2d5c9615
Changing the row’s margin doesn’t have any effect on the post’s content. It looks like the menu becomes an overlay header with the content of the page/post simply “snapping” to the top of the browser. Also when I make the header much larger as a test, the content stays in the same location (snapped to the top) and the bigger header simply hides more of the page/post. First I thought maybe it was because I hid the breadcrumbs of the post with custom css, but the problem persists and is exactly the same even when I remove that custom css.
It’s just my custom header with this problem, the header templates in the Theme Panel work fine.
Any ideas on how to solve this?
Thanks!
Hello !
It seems that your menu overlays the text. Try editing the overlay option using the tagDiv Composer like here: https://www.screencast.com/t/fBqqpghib and set it to default.
If the problem persists you can paste this code in your css editor and it should be working: body .td-header-mobile-wrap {
position: relative;
}
Thank you !
Hello !
It seems that your menu overlays the text. Try editing the overlay option using the tagDiv Composer like here: https://www.screencast.com/t/fBqqpghib and set it to default.
If the problem persists you can paste this code in your css editor and it should be working: body .td-header-mobile-wrap {
position: relative;
}
Thank you !
Hi Vlad,
I checked the Zone Specific Parameters and for all 4 viewports is already was on Default. So I tried the custom css your provided and it works perfectly.
Thanks!
Hi Vlad, I thought your code solved the problem, but it actually caused another problem. As you can see in the 2 screenshots on the link below the problem is solved on the pages/posts where the menu used to overlay the title on mobile (portrait). But now it has a big extra chunk of menu on all the other pages. So I had to remove the custom css.
Any thoughts?
Hello !
If you set the code set the settings file from the composer on Overlay. If you went for default then don’t insert the code.
If none of the versions above do not work please try this code: article
{
margin-top: 48px;
}
Thank you !
