Archived topic
How to Adjust Spacing for Submenu
5 replies · Started by Tom on January 15, 2021
Hi I have been trying to get the spacing between my submenu (where it starts) and the bottom of my header to align. Searched through options in primary navigation and secondary navigation but don't see what I'm looking for. I attach an image that shows the problem more clearly.
https://drive.google.com/file/d/1N0tV5UaZqXlnPvgU5QOi54kI89ZJS-x2/view?usp=sharing
Thanks,
Tom
Hi there,
Try this:
https://generatepress.com/forums/topic/submenu-positioning/#post-1577943
Adding CSS: https://docs.generatepress.com/article/adding-css/
Thanks Leo, seems to work (I changed from 10px to 20px).
Is the entire CSS code that David wrote there required to get this to work? Just don't want to put something that will cause a different issue later.
Code I'm using:
@media(min-width: 768px) {
.main-navigation .main-nav ul li.menu-item-has-children:before
{
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 80px; /* height of nav plus space below */
}
.main-navigation .main-nav ul ul {
margin-top: 20px;
}
}
Hi Tom,
If you are using Hover to open the submenu, you'll need the full CSS.
If you are not, then only this CSS is enough:
@media(min-width: 768px) {
.main-navigation .main-nav ul ul {
margin-top: 20px;
}
}
Let me know :)
Gotcha, yes I am using Hover. Okay thanks!
No problem :)