Archived topic
Navigation Menu Items, how to add a small gap/space in between the items?
7 replies · Started by bluebit on July 15, 2017
I have a menu where when I hover over the menu say Home is selected and has a color of grey, when I select the menu item next to home the background also changes to grey, but since Home is already grey, it looks like bad next to each other. I want to create a small space 1 or 2px in between the menu items that uses the navigation background color, just so its easier to see the separation of the menu items when i hover next to an already selected menu item.
Hi there,
How about a menu item separator?
Try this CSS:
.main-navigation .main-nav > ul > li:not(:last-child) > a {
border-right: 1px solid #DDD;
}Adding CSS: https://docs.generatepress.com/article/adding-css/
thanks, i tired it but i guess the original looks better, so i stayed with it. Could you login to my dummy acccount and see how I can fix the account page, its looks bad.
http://wildlatina.co/my-account/
username: laura
password: j8nJ8xzLZ)v&weW3oOTufesB
I couldn't login with those credentials.
username: laura
try this password: wMjx8!jZddasfWS4!2T1TPOU
Couple issues.
1. Your content has no padding.
2. Your body line-height is set to 0 in "Customize > Typography > Body".
how can I add padding, also i just checked, the line height is set to 1,5
so before you login, the account page padding, and once you log in, the account page padding needs to be fixed
Content padding can be found in Customize > Layout > Container.
Try looking for this CSS in your custom CSS:
.entry-content p {
line-height: 0;
}