Docs

[SnowWolf]

Hello,

I would like to know how to make an adjustment to the text in just one menu nav button (for desktop – mobile is fine the way it is.) I made the text for this particular link “wrap” — but it sits lower than the text in all the single line nav “buttons”.

The custom css I have in Customizer is:

.x-navbar .desktop .x-nav > li > a {
    width: 129px; text-align: center; 
}

.x-navbar .desktop .x-nav > li > a {
    line-height: 1.1;
}

.desktop .x-nav > .menu-item {
    width: 8.5em;
}

I have tried various things to modify this menu item, such as:

.desktop .x-nav > .menu-item-8534 > a { 
display: inline-block;
vertical-align: middle;
}

(I know this is the correct menu-item number, because if I make the display:none, the menu item disappears)

What do you recommend?
Thank you,
Dora

* I have attached a screenshot but did not include my client’s url because I do not see the option to make it private. Perhaps after I post this I will have that option…

[SnowWolf]

This reply has been marked as private.

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> Global CSS :

li#menu-item-8534 a {
    padding-top: 16px;
}

Hope that helps.

[SnowWolf]

Excellent!
I modified it a bit and I was also able to adjust the left padding to center it horizontally, too. 🙂

li#menu-item-8534 a {
    padding-top: 17px;
	padding-left: 24px;
}

Thank you Christopher!

[Friech]

You’re more than welcome, glad we could help.

Cheers!

[Author]

Posts