Hi everyone. I'm learning CSS and I've made an unordered list and styles it with CSS. My problem is that while it displays correctly in Firefox, in IE the list buttons appear lower then even. Here's the IE screenshot: http://www.servergrade.com.au/temp/ie-uneven-li.jpg The HTML is pretty standard. <div id="button"> <ul> <li><a href="#">Home</a></li> <li><a href="#">Australian Hosting Plans</a></li> <li><a href="#">Australian Windows Plans</a></li> <li><a href="#">Budget Hosting Plans</a></li> <li><a href="#">Budget Windows Plans</a></li> <li><a href="#">FAQ</a></li> <li><a href="#">Contact ServerGrade</a></li> </ul> </div> The CSS is: #button ul { color: #FFFFFF; } #button li a { display: block; padding: 3px 5px 5px 0.2em; border-left: 5px solid #004fbe; border-right: 5px solid #004fbe; background-color: #004fbe; color: #fff; text-decoration: none; width: 100%; } html>body #button li a { width: auto; } #button li a:hover { border-left: 5px solid #1c64d1; border-right: 5px solid #1c64d1; background-color: #2586d7; color: #fff; } The full CSS file can be seen here: http://www.servergrade.com.au/css/mystyle2.css and the page here: http://www.servergrade.com.au/index5.html I tried deleting everything in the CSS file except the CSS above, but IE still makes displays it as uneven. Thanks for any suggestions you may have. CoffeeCoder