[Support request] Mobile Menu Merging with Content Title

[24xstudio]

Hey,

Whenever someone opens the mobile menu it merges with the title of the content. Just check the URL on the mobile version.

[Leo]

Hi there,

Any specific reason you are using a merged header element for that page?

Let me know 🙂

[24xstudio]

It because if I don’t merge it then it looks like this: https://prnt.sc/pmw3zx

[Leo]

That should be pretty easy to fix without merging.

Can you disable the merged header element and let me have a look?

[24xstudio]

Done.

But I need to do this on posts only.

[David]

Hi there,

just need to remove the top padding from the site-content on the single posts like so:

.single-post .site-content {
    padding-top: 0;
}

[24xstudio]

What if I want this option in pages also?

[David]

Can either target the specifically like the CSS above, or alternatively you can use negative margins on the top Kadence row with this CSS:

.wp-block-kadence-rowlayout.topcont {
    margin-top: -40px;
}
@media(max-width: 768px) {
    .wp-block-kadence-rowlayout.topcont {
        margin-top: -30px;
    }
}

[24xstudio]

The second CSS for pages is not working for me.

The first one for the posts is working fine!

[David]

I just looked at your About page, looks like you have already added a negative top margin to the Kadence Row (?) – you don’t need to do that and the CSS i provided.

[Author]

Posts