Need Help :hover For Ie8 Beta2 Need CSS help

[puneye 0]

I just make Menu using Dreamweaver CS4. The menu is simple only text. I used block properties for this menu and I make hover effect on it. But hover effect greatly works on Mozilla Firefox and Google Chrome but not works in Internet Explorer 8 Beta (I thinks it will not work on IE7 and above). I googled for it but not able to solve the issue then post here waiting the solution. If you know about it please help me. I am giving following code for reference.
Html code

<div id="menu"><ul>
<li><a href="#">Home</a></li>
<li><a href="#">About us</a></li>
</ul>
</div>

and my CSS code

#menu { float: left;
height: 40px;
width: 490px;
}
#menu ul {
margin: 0px;
padding: 0px;
list-style-type: none;
text-align: left;
}
#menu ul li {
}
#menu ul li a {
display: block;
font-size: 16px;
font-weight: bold;
color: #999;
padding: 10px;
float: left;
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
}
#menu ul li a:hover{
background:#ccc;
color: #000;
}

[mamer 0]

Have you tried to change the nesting #menu ul li a:hover{ into something the IE could understand? I'm just suggesting experimenting not giving a full proof solution.For me I find IE kind of a waste of space and makes designers pull their hair all the time.