Archived topic
Navigation Dropdown Single Row Center Align?
3 replies · Started by Webmaster on March 2, 2022
Does such a snippet of exist in the GeneratePress databanks? I was wondering if there was a quick customization option to open the dropdown menu in a single row and align center horizontal (or justify align) the sub menu nav items. I was floating around in the docs and I didn't see anything. Maybe I missed over it?
Here is an example of the menu in the wild:
Desired Dropdown:
Menu Item 1 | Menu Item 2 | Menu Item 3
Dropdown 1a | Dropdown 1b | Dropdown 1c
Default Dropdown:
Menu Item 1 | Menu Item 1 | Menu Item 3
Dropdown 1a
Dropdown 1b
Dropdown 1c
Hi there,
Here is an article if you may want to do a simple Megu menu: https://docs.generatepress.com/article/building-simple-mega-menu/
Moreover, here is a thread where they successfully changed the submenu to dropdown horizontally: https://generatepress.com/forums/topic/submenu-dropdown-change-from-vertical-to-horizontal/#post-184907
If none of these are working for you, can you provide a link to the site in question, and we’ll see if we can provide an appropriate solution?
Hope this helps. Feel free to reach out if further assistance is needed. :)
Thanks Fernando, that post from 2016 almost did the job... tweaked code a little bit to get results.
body .sf-menu > li {
position: static;
}
body .main-navigation ul.menu > li > ul {
width: 100%;
left: 0 !important;
right: 0 !important;
margin: 0 auto;
text-align: center;
}
body .main-navigation ul.menu > li > ul > li {
width: auto;
display: inline-block;
}
body .main-navigation ul.menu > li > ul > li ul {
left: 0;
top: 100%;
}You’re welcome! Glad to be of assistance! Feel free to reach out if you’ll need assistance with anything else. :)
