I created a navigation bar which is exhibiting rather odd behavior after
using CSS styles.
The code, including the internal style sheet, is below. (The links won't
work for you--what I am concerned about is the styling.)
When you look at the page in IE6, IE6 has inserted dark grey horizontal
bars between all the list items, except in 3 cases:
between the 1st and 2nd items; between 2nd and 3rd list items; between
the 4th and 5th items.
Netscape does not insert any such horizontal grey bars.
As you can see from the code, these horizontal grey bars are an artifact
of IE rendering. The bars are not in the code. I would appreciate any ideas
as to what could be causing this IE6 behavior and how it can be stopped or
at least made uniform, so that the grey bars are inserted between all the
list items.
Thanks in advance, CMA
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>sidebar2</title>
<style type="text/css">
<!--
#navlist
{padding: 0 1px 1px;
margin-left: 0;
font: bold 12px Verdana, sans-serif;
background: gray;
width: 13em;}
#navlist li
{list-style: none;
margin: 0;
border-top: 1px solid gray;
text-align: left;}
#navlist li a
{display: block;
padding: 0.25em 0.5em 0.25em 0.75em;
border-left: 1em solid #AAB;
background: #CCD;
text-decoration: none;}
#navlist li a:link { color: #448; }
#navlist li a:visited { color: #667; }
#navlist li a:hover
{border-color: #FE3;
color: #FFF;
background: #332;}
-->
</style>
</head>
<body>
<div id="navcontainer">
<ul id="navlist">
<li><a href="Earlyall.htm" title="early clothing">EARLY </a></li>
<li><a href="victall.htm" title="Victorian clothing">VICTORIAN </a></li>
<li><a href="EdwardianVintageClothing.htm" title="Edwardian
clothing">EDWARDIAN</a></li>
<li><a href="20sall.htm" title="1920's clothing">1920'S </a></li>
<li><a href="30sall.htm" title="1930's-1950's
clothing">1930'S-1950'S</a></li>
<li><a href="Designer Vintage Clothing.htm" title="designer
clothing">DESIGNER</a></li>
<li><a href="Jewelry.htm" title="jewelry">JEWELRY</a></li>
<li><a href="AntiqueTextiles.htm" title="textiles">TEXTILES</a></li>
<li><a href="shawlall.htm" title="shawls">SHAWLS</a></li>
<li><a href="treasure hunt.htm" title="treasure hunt">TREASURE
HUNT</a></li>
<li><a href="articlesall.htm" title="Articles">ARTICLES</a></li>
</ul>
<p> </p>
<p> </p>
</div>
</body>
</html>
