IE HACK for "Eric Meyer's Strengthening the links"

Author: Maks Feltrin

Comments: This is just a hack for ie bug in "Eric Meyer's Strengthening the links" list. IE(6) show an unexspected bottom-border for each li. This hack solves the problem giving a fixed width for ul and a.

Browser support chart

<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>

width: 158px;
\width: 160px;
w\idth: 158px;
padding: 0px;
border: 1px solid #808080;
border-top: 0px;
margin: 0px;
font: bold 12px verdana,helvetica,arial,sans-serif;
background: #808080;

ul#navlist li
list-style: none;
margin: 0px;
border: 0px;
border-top: 1px solid #808080;

ul#navlist li a
display: block;
width: 122px;
\width: 158px;
w\idth: 122px;
padding: 4px 8px 4px 8px;
border: 0px;
border-left: 20px solid #aaaabb;
background: #ccccdd;
text-decoration: none;
text-align: right;

ul#navlist li a:link { color: #666677; }
div#navcontainer li a:visited { color: #666677; }

ul#navlist li a:hover
border-color: #ff9000;
color: #ffffff;
background: #000d33;

Some lists within the Listamatic site had to be modified so that they could work on Listamatic's simple list model. When in doubt, use the external resource first, or at least compare both models to see which one suits your needs.