Question

I’m trying to make a div’s background color change on mouse over.

the div {background:white;}
the div a:hover{background:grey; width:100%;
display:block; text-decoration:none;}

only the link inside the div gets the background color.

what could I do to make the whole div get that background color?

thank you

EDIT :
how can I make the whole div to act as a link – when you click anywhere on that div, to take you to an address.

Answer 1

The ‘a:hover‘ literally tells the browser to change the properties for the <a>-tag, when the mouse is hovered over it. What you perhaps meant was ‘the div:hover‘ instead, which would trigger when the div was chosen.

Just to make sure, if you want to change only one particular div, give it an id (‘<div id='something'>‘) and use the CSS ‘#something:hover {...}‘ instead. If you want to edit a group of divs, make them into a class (‘<div class='else'>‘) and use the CSS ‘.else {...}‘ in this case (note the period before the class’ name!)