CSS Probleem?

Hey,

Ik ben even voor iemand aan het basen, maar nu stuit ik op een probleem. In IE9 dan komt het menu er zo uit te zien:
In andere browser werkt hij volgensmij naar behoren. Wie zou me daarbij kunnen helpen.

CSS
#menu { width: 340px; height: 55px; background: url(img/menu.png);  float: left; margin: 70px 0px 0px 0px; }
    #menu ul { list-style-type: none; margin: 0; padding-left: 20px; }
    #menu ul li { float: left; width: 100px;  text-align: center; }
     #menu ul li a { display: block; text-decoration: none; font: 11px Arial; color: #85823a; line-height: 50px; } 
     #menu ul li a:hover { background: url(img/hover.png); height: 55px; padding-right: 10px; display: block;  }

je zet informatie in je a:hover die je niet in je a zet. Dit zou andersom moeten, in je a:hover zet je alleen extra informatie zoals die afbeelding, de rest neemt die automatisch over van a zelf.

Thank You Marjolein!