How to change text color of a specific navigation menu with CSS?

Store Design
1

Hi everyone!
I need help for CSS coding on Cascade Theme → I would like to change the text color of only one of my main navigation menu to highlight it.

The last one “Petits prix” navigation menu should appear in the #db2b4e color rather than black.
I tried to quibble with the code but nothing to do, the color does not change. I’m having trouble identifying my menu or placing my code incorrectly on my CSS stylesheet.

Thank you for your help!

Capture d’écran 2021-08-03 à 23.57.18.png
Capture d’écran 2021-08-03 à 23.57.18.png2878×662 211 KB

2

Hey @NG_01 ,
Are you able to provide your store URL? I need to take a look at the store before being able to offer any help.

3

Hey @Muhammad_Ali_S thank you for your reply!
Here is the store URL : https://lecyclismeaufeminin.com/

Thanks!

4

@NG_01

Please add the following code at the bottom of your assets/theme.min.css file.

.site-nav li a[href="/collections/petits-prix"] {
    color: #db2b4e;
}

Hope this works.

Thanks!

5

Thank you so much @dmwwebartisan !! It works!

6

Hi @dmwwebartisan ,

Could you also help for my URL https://bove.co/ (Empire theme)?

I’ve been trying to get the menu “SALE” font into all red #ff0000.

Screenshot 2021-10-29 192107.png
Screenshot 2021-10-29 192107.png883×226 48.8 KB

7

@BoveSpring

Please add the following code at the bottom of your assets/theme.scss.liquid file.

.site-navigation .navmenu-item-parent, .site-navigation .navmenu-id-sale .navmenu-link-parent {
    color:#ff0000 !important;
}

Thanks!

8

@dmwwebartisan - the code works like a charm. Thank you!