Make the menu bar use full screen width


#1

Dear support,
I have problems making my menu bar full width as it is limited by the .clearfix.container. I would want the black bar of the menu to be full screen width, so I can adjust where the ‘home’ button starts myself using margin-left.

I hope you can help me.

Thanks in advance already.

Best,
Maarten


#2

My site is https://howtogetrippedathome.com/
Sorry, forgot the URL


#3

Hi there,

Try the following CSS code please:

.site-header > .container:first-child {
    width: 100%;
}
.site-header nav .sf-menu {
    padding-left: 10%;
    padding-right: 10%;
}

Use padding-left and padding-right to adjust the left and right space of the menu bar.

Regards,
Awan


#4

Thanks a lot! Worked like a charm.