How is correct to write :hover before the element or after?

How is correct to write :hover before the element or after?
0.0 0

#1

There have any rules that like for input elements the input:focus need to be first and after that the input element or can be second only? Or matter?

Thanks!


#2

Not sure what your question is. Can you give an example of what you are trying to do?


#3

input{background: red;}
input:focus{background: green;}

or
input:focus{background: green;}
input{background: red;}

Any rules for the order list?


#4

When you test it both ways, what are your findings? Does it have the same effect either way?


#5

I ask this because like on :hover versus :active is for that have an order list:

( :active MUST come after :hover (if present) in the CSS definition in order to be effective!)

Found nothing about this thing on net. Some person write first some after first element property.


#6

a:link {color: blue;}
a:visited {color: purple;}
a:hover {color: red;}
a:active {color: yellow;}

&

https://www.w3schools.com/css/css_pseudo_classes.asp

Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective! a:active MUST come after a:hover in the CSS definition in order to be effective! Pseudo-class names are not case-sensitive.


#7

Yes got that.

But what about :hover :)? As standard?


#8

Above is the documentation stating this.

In general, unless the documentation states otherwise, the order would not make a difference. If all else fails, you can test it yourself to see what happens.