Docs

[Mary Beth M]

Hello team! Pretty specific question about how to align a single menu item (which is an icon) with the other text menu items.

I attached a screenshot of what it looks like now, and the small adjustment I need to make.

I do know the menu item number that I want to change the alignment for is 993, so I was thinking I could do something easy like adjusting the top margin or padding, but I’m having trouble finding the right class that will work.

I used something similar to this when hiding something else from the menu on another site, but it didn’t work this time. I was using renew on that one and Ethos on this site if that makes a difference on writing the particular class?

.x-nav-wrap .desktop .menu-item, .x-menu-item, .menu-item-993 {
margin-top:10px;
}

But that of course didn’t work so before moving on to different solution ideas, figured I should check and see how far off I was with my CSS, or if you had a better way to achieve this look. Maybe aligning the menu items to the bottom of the items instead of the top?

Thank you for any assistance. The site is in maintenance mode, so I’ll send the login in a private message in case you need to look at it.

Thankyou for any help Cheers!

[Mary Beth M]

This reply has been marked as private.

[Friech]

Hi There,

Thanks for writing in! Maybe you already got the right css code, but it did not work because of the syntax error somewhere on your custom CSS. Please check your entire custom CSS here: http://csslint.net/ first.

Only then add this:

.x-navbar .desktop .x-nav > li#menu-item-993 > a {
	padding-top: 56px; 
}

Hope it helps, Cheers!

[Author]

Posts