Archived topic
How to reduce space between each page on mobile menu view
2 replies · Started by Gary on August 16, 2018
Hi,
I've checked forums and seen posts similar about reducing gaps between logo and start of menu etc but nothing about reducing the gaps between the menus themselves. On the domain I will list there are very large gaps between for example Home, About Us, Blog etc. This results in the last menu item not being visible.
Can you suggest a setting or CSS that will fix this? If you suggest CSS does it need to be added to Customize - Additional CSS?
Thanks
Gary
Hi there,
What if you decrease the menu item height for mobile?
https://docs.generatepress.com/article/menu-item-height-width/
If you want to keep the current header height on mobile and only want to decrease the menu item height, then try this CSS:
@media (max-width: 768px) {
.main-navigation .main-nav ul li a {
line-height: 70px;
}
}Adding CSS: https://docs.generatepress.com/article/adding-css/
Let me know if this helps :)
No problem :)
p.s. make sure you reply on here on the thread instead of the e-mail notification.
