Question

Is this valid CSS syntax?

li:hover{
  css rules ...
  span {
    css rules ...
  }
}

It works, but I’m not sure if it’s valid.

Answer 1

You can’t nest CSS rules like that. If you want to select span elements inside hovered li elements you need to write two seperate rules:

li:hover{
  /* CSS */
}
li:hover span{
  /* CSS */
}

Unless you’re using less for which you can nest rules, and it will compile into regular CSS.