[Resolved] menu contained with margin?

[Jasper]

On this site the menu is set to contained with a container width set to 1100px. It seems the menu bar is not set to 1100px wide? https://test.een-haarlemmermeer.nl/
Regards

edit: by the way it is only on the homepage, don’t know why?

[Leo]

Hi there,

Strange that it would do that. Can you try this CSS to fix it for now?

nav#site-navigation {
    margin-left: 401.5px !important;
    margin-right: 401.5px !important;
}

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

I’ll ask Tom to have a look. Thanks 🙂

[Jasper]

this works, but only on a 1920 px wide screen…………

[Leo]

ah yeah right. I’ll ask Tom to take a look 🙂

[Tom]

You’ll definitely want to remove that margin CSS.

Here’s what I’m seeing on the home page: https://www.screencast.com/t/EpHzlBlZQT3a

Are you seeing something different?

[Jasper]

sorry, that was still with the previous css
please look again

[Tom]

It seems you’re using Elementor on that page (shouldn’t be necessary to use when achieving the layout you have).

They have the width set to 100%, plus 10px padding. So the page is 1110px wide.

I would either use the regular content on that page, or remove the padding from your Elementor section and just use the built in GP content padding.

[Jasper]

i’m not sure if that is true. i have set the padding in the elementor (slide) section to 0 (no gap).
If your suggestion is the case then why is this happening only on the frontpage?

[Leo]

Looks like you are not using Elementor on the other pages currently.

[Jasper]

now second page does, and the menu is nicely at 1100px
the homepage is still off

the slider in the header is an elementor template placed there using a hook and shortcode

[Tom]

The yellow is the padding set by Elementor: https://www.screencast.com/t/cT6uULxGTLM

You can also see the width: 100% on the right there.

[Jasper]

issue just disappeared, probably a cache problem….

[Tom]

Great to hear 🙂

[Author]

Posts