IE6 custom css does not work

[Alex D]

Hi,

I'm using a custom style sheet in IE6 to override the funny
font and color use of websites, but have a problem with some
font colors.

Here is a part of my css:

:link {
text-decoration: none;
font-weight: normal;
color: blue ! important;
background: #CCFFFF ! important;
}

a:visited {
text-decoration: none;
font-weight: normal;
color: red ! important;
background: #FFE4E1 ! important;
}

a:active {
text-decoration: none;
font-weight: normal;
color: red;
background: #00FFCC;
}

The ! important is supposed to override color, but - to take
an example, in this page (http://www.atcevents.com/), see
the menu
on the left: light fonts on a dark background do not take
the color as specified in the css.

(In IE/Options, Font colors as specified on Web pages are
ignored)


Help!

ps - I had a lot of difficulty finding an example of such
sucking websites in my Favorites - another indication, I
think, these webmasters suck.)

 

[Jukka K. Korpela]

The ! important is supposed to override color, but - to take
an example, in this page (http://www.atcevents.com/), see
the menu
on the left: light fonts on a dark background do not take
the color as specified in the css.

I'm used to writing "!important" and not "! important", and I first
thought that the reason was the space. But after spending some time
with the CSS2 specification - it doesn't really say this except in the
formalized syntax, or actually in the code of a lexícal scanner - I
found that a space, or any whitespace, is allowed between "!" and
"important". http://www.w3.org/TR/REC-CSS2/grammar.html says
"!{w}important" {return IMPORTANT_SYM;}
where w stands for any amount of whitespace.

So the explanation must be something different. On the page you
mention, the links you refer to contain font elements, e.g.

<font color="ffffff">Register

Now</font></a></td>

And since there is nothing in your style sheet that sets properties for
the font element, the browser uses the properties set on the page. The
color="ffffff" attribute is presumably error-corrected by IE into
color="#ffffff" and then effectively mapped to its CSS counterpart,
setting the color property for font.

In theory,
font { color: inherit !important; background: inherit !important; }
should fix this, but IE does not support the inherit keyword.

But using
:link, :link * { ... }
:visited, :visited * { ... }
helps, since IE supports the universal selector *. These rules set the
properties for any element inside a link element.

(In IE/Options, Font colors as specified on Web pages are
ignored)

I must admit I don't know what that setting really causes. If I use the
technique I suggested, then your colors are imposed on the links when
that setting is _not_ checked (sounds OK since !important should
override page colors anyway), but when it _is_ checked, I get the
browser's default colors for anything, including those links.
(Or, actually, the colors set in the browser settings, ignoring any
style sheets.)

 

[Safalra]

I'm using a custom style sheet in IE6 to override the funny
font and color use of websites, but have a problem with some
font colors. Here is a part of my css:
[snip styling of links]
The ! important is supposed to override color, but - to take
an example, in this page (http://www.atcevents.com/), see
the menu
on the left: light fonts on a dark background do not take
the color as specified in the css.

I suspect it's because on that page the <font> tag is *inside* the <a>
tag. Perhaps IE allows you to style the <font> element itself? (That's
only a guess though, as I'm a Mozilla user...)

--- Safalra (Stephen Morley) ---
http://www.safalra.com/hypertext

 

[Alex D]

It works now - thanks a lot!

-alex-