Как применить стили для одного элемента меню WP?

Question

[Максим Мирошник]

Подскажите пожалуйста - не могу поменять цвет для одного пункта меню на WP.
По началу видимо проблема была в том что тема генерировала без id - добавил и теперь в коде выводится айди элемента меню:

<li id="nav-menu-item-7541"><a href="https://kalkuliator/">Каталог товарів</a></li>

но стили все равно не применяются и не получается этот элемент выделить цветом:

#mainnav li.nav-menu-item-7541 a {
	color: #1e73be !important;
}

Прошу Вашей помощи!

Comments

[Andrej Sharapov]

нужная полная менюшка. А вообще, если у вас нет айди, вы можете отсчитать этот пункт через nth-child(n) и прилепить ему стили. Примерно так: #mainnav > li:nth-child(n) > li:nth-child(n) > a

Как-то так, но опять же, нужна полная менюшка в песочнице

И еще, замените .nav-menu-item-7541 на # - ведь это айди, а не класс

Answer 1

[Орхан Гасанлы]

Здравствуйте!
Ваш код:

#mainnav li.nav-menu-item-7541 a {
  color: #1e73be !important;
}

Должно быть:

#nav-menu-item-7541 a {
  color: #1e73be !important;
}

id="nav-menu-item-7541"
В вашем сниппете вы пытаетесь поменять класс, а не ID. Если ID, то добавляйте шарп (#), а если класс, то точку (.)

Ну и как вам подсказали вы можете поменять без id или класса при помощи ::nth-child() НО! учтите, что при добавлении элементов меню до изменяемого пункта стиль может сместиться. Например, вы применили стиль 3-му элементу меню, а затем добавили новый пункт меню до 3-го элемента и получится, что стиль будет выделен 3-й, но при этом не тот пункт меню, который вы изначально планировали выделить