Extend horizontal submenu background

Hi there,

Which part? The grey or black? Can you link me to the site?

The black part. I want to extend it full width. https://fusion.shakescal.com

You could try this CSS:

.inside-navigation {
    position: static;
}

Hi Tom,

Now it fixed the issue. But one more thing, please check the link, how can I align the submenu list with the primary menu and make it contained.

See the link =) thanks!

Hmm, it's not possible to contain it like that unfortunately.

You can however center it:

.main-navigation ul ul.sub-menu {
    text-align: center;
}

ul.sub-menu li {
    float: none;
    display: inline-block;
}

Thanks Tom!

Now it's ok. One more thing, how do I change the hover background and just stick it to orange. See screenshot: https://goo.gl/3woqoC

Lastly, how do I revert it to normal mobile menu.

Thanks!

Have you tried Customizer > Colors > Primary Navigation > Background Hover?

Not sure what you mean by reverting it to normal mobile menu?

Hi Leo,

The colors worked. I missed it my apologies.

I'm referring to the mobile view, the primary sub-navigation doesn't work well. See: https://image.prntscr.com/image/uxoFjVUhQB_nL2a18TJplg.png

Please advise.

Thanks

Try adding all of your custom CSS you added for the sub-menu in a media query like this:

@media (min-width:769px) {
    /* custom menu CSS in here */
}

Nailed it Tom, cheers!

Glad I could help! :)