Hover background colour not working (grouping of CSS divs)

[stephen_]

Hi,

I'm trying to create a hover selector on 3 seperate divs - for some reason when I grouped this in the CSS only one of the div's works the other 2 do not?

Code is pened here - http://codepen.io/valleysboy/pen/Jfdco

Any help on my poor syntax is appriciated!

[Paul O'B]

Hi,

You only applied the hover effect to one box. Add :hover to all three and it will work.

e.g.

#right-box:hover , #left-box:hover , #center-box:hover { etc....

[stephen_]

Thanks Paul - thought by grouping them I only needed to declare :hover on the final div.
<Amedned the code on the pen link above for others to reference).

[Paul O'B]

Thanks Paul - thought by grouping them I only needed to declare :hover on the final div.
<Amedned the code on the pen link above for others to reference).

It's a common mistake

A comma separated list is just a list of separate items that have no relation to anything else in the list. The only think they have in common is that they will all use the styles declared in the style block.