I need to know how to work around a particularly lame Internet Explorer bug in their CSS1 parser model.
http://sedonner.tripod.com/adec
On that page, hovering over the links is hard to read (whether the links are :visited (vlink) or regular link status doesn't matter).
A {
font-family: arial, helvetica, geneva, swiss, sunsans-regular;
font-size: 12pt;
font-weight: none;
text-decoration: none;
}
A:hover {
text-decoration: underline;
color: #003366;
}
A:visited {
color: #336699
}
I've got a div classed as div class='header'
In my CSS, I've got a class selector defined as:
.header a {
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 5px;
background-color: #003366;
color: white;
}
.header {
padding-top: 5px;
padding-bottom: 5px;
background-color: #003366;
color: white;
}
The problem is that IE6 is ignoring the fact that my 'header' class defines the |a| element's color as white, and therefore on mouseover styles the link text as either:
* if it's :visited, it styles it #336699
* if it's _not_ :visited, it styles it as #003366
Anybody know how to work around this? Thanks!
your CSS could use a little tidying in general - mixing up the style of A elements and :link/:visited just leads to confusion. Why not use :link and :visited instead of the A? And "font-weight: none" isn't valid - you probably mean "font-weight: normal", but that's the default so you don't need to specify.
anyway, easiest change to make it work how you want is to explicitly style the hovered header link:
instead of just:
.header a {
use:
.header a, .header a:hover {
and it works fine.
Thanks Michael. I've fixed it now:
http://sedonner.tripod.com/adec/text.css