Archived topic
submenu wide
5 replies · Started by Jeroen on April 15, 2021
Hi
Default, a submenu shows rather small (in width):
https://drive.google.com/file/d/1yM93vBUQ1XBKVOy3To0lHxsapp2iOs-6/view?usp=sharing
Is it possible to 'css' it such that it takes up the available space?
https://drive.google.com/file/d/1sE_FKHrAJ1WK8b-er5vuD8Wzg2QahG-o/view?usp=sharing
(I do not mean using a mega menu to show all submenu's - I found that one on the forums, it's nice but I need only the pages of one parent for this design)
Jeroen
Hi there,
can you share a link to a page where i can see the sub-menu and we will see what CSS we can provide.
Hi David
Thanks for taking a look, you can pls use the login I send along
Jeroen
You could try this:
@media(min-width: 769px) {
.main-navigation li.menu-item {
position: initial;
}
.main-navigation:not(.toggled) ul li.sfHover>ul,
.main-navigation:not(.toggled) ul li:hover>ul {
left: 0;
right: 0;
width: 100%;
padding: 20px;
}
}That will set make it as wide as the inside navigation container. Can't really make it any larger without it being full screen - and then its a nightmare to keep the sub menu items contained.
Wow, thanks! That is exactly what I meant, it should be as wide as this :-)
Much appreciated
Awesome - glad to be of help :)
