I really cannot understand it, I've tried several different ways of writing it that I'm sure I've used before, and I simply cannot get :hover to work with any of my divs...
html:
<a href=''><div id='menu' class='button1'></div></a>
<a href=''><div id='menu' class='button2'></div></a>
<a href=''><div id='menu' class='button3'></div></a>
<a href=''><div id='menu' class='button4'></div></a>
css:
#menu {
width:75px;
height:75px;
background-color:red;
/* background-image:url('menu.jpg'); */
float:left;
margin:20px;
}
.button1:hover {
/* background-position:75px 75px; */
background-color:yellow;
}
as you can see I've commented out the image, ultimately I want the image to appear, but for now I can't get the :hover to change the state of the div at all, no reaction...
any help would be much appreciated, its really frustrating me...