Help with border-radius

Hi, I'm building a website and I made a menu bar from html and css. I used border-radius to round the corners, but when I added the :hover extension, border-radius does not work. So when you hover over the links with border-radius the corners turn back to 90 degree angles. Any help would be appreciated. Here's my code...

<div id="menu"> <!--  menu bar --> 
 
<ul>
<li><a id="firstradius" href="index.html">Home</a></li>
<li><a href="first.html">First</a></li>
<li><a href="second.html">Second</a></li>
<li><a href="third.html">Third</a></li>

Border Radius Tool

Fancy little border-radius tool I just ran across.
http://border-radius.com/

Syndicate content