Can I apply two styles to one element at the same time?

Hello again! Thank you for always helping me out here , I get here confused, I come out with relief :laughing:
I am trying to make this header :


So when anyone visits the website , (Home) would already be yellow without hovering it, and when hovering on other nav bars, they will become yellow.
How can I make Home yellow from the start, and the same time when I hover other bars , I want the yellow to show in the hovered bar not (home)
Sorry for taking long .Thank you

It is really difficult to give a clear answer without details. It’s also not clear if you’re using a view library or if you are just html/css.

Can I apply two styles to one element at the same time

It depends on what you mean by that. Can an element execute to color properties at the same time? No. Can an element have two color properties given to it? Sure. CSS will determine which one to use based on the rules of specificity. But sure, you can pile on conditional classes and styles and hover events and whatever.

1 Like

Thank you for clearing this out !!
I am actually working only on html and css files, I thought about adding a class to the five main li elements of my nav bar, and style this class with hover style. and adding (active class) to Home specifically so it would be always yellow unless I hover other bars .

Yeah, some combination of that should work. In theory you could apply a class like “navLink” to all the nav links and then have an additional one called something like “homeNavLink” to the first one, and do a hover event for “navLink”. There are ways to do it.

1 Like