Site logo

Archived topic

How to reduce the whitespace in the SecondaryHeadermenu

3 replies · Started by Jenny on July 7, 2022

Viewing posts 1–4 of 4

Hi Jenny,

Can you temporarily disable all caching/optimization plugins? There’s CSS which I can’t say for sure where are coming from.

I’ll try to provide an appropriate fix after they’re disabled.

Hope to hear from you soon.

Shure :) it's deactivated

Thank you!

First, you have this CSS in the style.css of you Child theme:

.pll-parent-menu-item {
    margin-right: 4rem;
}

Try putting it in a query so it’s not added on mobile view:

@media (min-width: 769px) {
    .pll-parent-menu-item {
        margin-right: 4rem;
    }
}

You also have this code which is already in a media query adding spacing on mobile in Additional CSS:

ul {
    margin-left: 1.5em !important;
}

Lastly, you have 2 empty Paragraph Blocks which you’ll need to delete to achieve the layout you’re going for: https://share.getcloudapp.com/12uLzOWP

Once you’ve deleted the 2 Paragraph Blocks, you may add this CSS:

@media (max-width: 768px) {
    .secondary-nav-aligned-right .secondary-navigation .inside-navigation {
        justify-content: space-between;
    }
}

It should look like this afterwards: https://share.getcloudapp.com/nOuXbYAE

Hope this helps!

This archived topic is closed to new replies.