Main Menu Item bold

1a-outplacemet · February 2020

Hi, I have three menu items with submenu. These items from the main menu should be bold. I realized this with this code

li#menu-item-472 span

{

color:#043366;

font-weight:bold;

}

But now every sub menu item is bold too and these items should not be bold. How could I manage this?

The page ist: https://thomasweber-coaching.de/

Also it seems that this bold items now have a little shadow... its a bit fuzzy.

Thanks for your help.

Sophie

Pablo · February 2020

Hello Sophie,

In this case, you should use the :nth-child() selector to achieve that.

See how it works here:

https://www.w3schools.com/cssref/sel_nth-child.asp

Thanks

1a-outplacemet · February 2020

Hi Pablo,

what you mind to give me a quick example? I did not get it working...

Thanks a lot.

Sophie

Pablo · February 2020

So, if you have three items, lets say <ul> <li></li> <li></li> <li></li> </ul> and you want to catch only second element, you should create a CSS code like: ul li:nth-child(1){ herecss }

Remember, that nth-child starts counting from 0.

Thanks

1a-outplacemet · February 2020

Thanks.

Main Menu Item bold

Comments