bg block colour rollover

Question

Hi im struggling to insert a rollover background colour behind a a menu on Wordpress. Im trying to achieve something like this yellow band on this site http://alecsoth.com/photography/

this is my css for the menu (at present i can get the grey box and have tried background colour a:hover links but can't seem to get it to work) -

/* =Layout
------------------------------------------------------------------*/

#wrapper {

width: 80; margin: 0 auto; }

#header {
display: block;
}

#main_nav {

width: 10em; margin: -2.8em 0 0 0; float: left; display: inline; position: fixed; width: 170px; height: 100%; padding: -18.0em 4.3em 9.1em 5.5em; background: #f5f5f5

}

#content {

width: 80em; margin: 1.7em 0 0 0; float: right; display: inline; min-height: 30em; }

#entry_content {

width: 60em; margin: 0 2.5em 0 4.5em; float: left; display: inline; }

Answer 1

What you want to do is use the :hover pseudo-class like so:

#main_nav:hover { background: #NEWCOLOR }

Just pop this line into your css file and change NEWCOLOR to the color hex of your desire.