Full Width Nav

[hivehouse]

Is there a way for a nav to stretch the full width of the container it is in versus being just the width of the nav itself.

[XSupport]

Hi there,

Thanks for writing in! To assist you with this, we’ll first need you to provide us with your URL as stated on the forum entrance page. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you.

Meanwhile, please try adding following under Custom > CSS in the Customizer:

.masthead .x-container-fluid {
   max-width: none;
   width: 100%;
}

Hope this helps.

Thank you.

[hivehouse]

I added a secure note with all the information. Thank you for checking.

[rad]

Hi there,

Please follow this

You can the same in top-level links, please inspect your header bar and go to Flex Layout section, then change its Horizontal option to Space Around.

But, it’s not possible for sub-menu to have the same full-width layout. What you could do is use the X standard header and mega-menu. Like from here https://theme.co/apex/forum/t/features-megamenus/99

Thanks!

[hivehouse]

Unfortunately, I cannot use the megamenus options since I’m using the Pro headers.

[rad]

Hi there,

I see, in that case, I recommend using Ubermenu and its megamenu feature. You can add your Ubermenu shortcode in your header text element.

Thanks!