Bieler Batiste's list

Author: Bieler Batiste

Comments: This list is built to have a correct display in IE5+ for PC when the <a> element is display as block

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>

#navlist li
display: inline;
/* for IE5 and IE6 */

width: 7em;
/* to display the list horizontaly */
font-family: sans-serif;
margin: 0 0 0 3em;
padding: 0;
border-top: 1px #000 solid;
border-left: 1px #000 solid;
border-right: 1px #000 solid;

#navlist a
width: 99.99%;
/* extend the sensible area to the maximum with IE5 */
display: block;
background-color: #fff;
border-bottom: 1px #000 solid;
text-align: center;
text-decoration: none;
color: #000;

#navlist a:hover { background-color: orange; }
#navlist a:visited { color: #000; }

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.