Posted by Alan J. Flavell on 09/19/05 10:18

On Sun, 18 Sep 2005, kchayka wrote:

> Alan J. Flavell wrote:
>
> > On Sat, 17 Sep 2005, Edwin van der Vaart wrote:
> >
> >> #title h1 {color: #990000; background: transparent;}.
> >
> > Your CSS is unwise. For safe cascading, one should specify a definite
> > colour for both properties - or for neither.
>
> The CSS wouldn't be unwise if:
> #title { color: #000; background: #fff url(img.png); }
>
> Assuming the foreground colors contrast acceptably with img.png, of
> course. They do contrast with #fff.

No, it's about *Cascading*: you can't just look at the one stylesheet and
reckon the job complete - in general you've got to consider cascading with
a stylesheet not under the author's control (for example a user
stylesheet; or one imposed by the corporate guidelines, which might
change).

With "transparent" on the overlying element, the colour that will shine
through from an underlying element is the b.g.colour that results after
the cascade has been done. You don't in general know what that is, and it
might not contrast with your choice of text colour.

To be sure that there will always be a contrast, and text therefore
visible, the guideline is that every property should specify a definite
colour either for both properties or neither. That's true for every
stylesheet which participates in the cascade. And that's IMHO what the
W3C checker is advising you about.

Mixing "transparent" or "inherit" with definite colours does *not* satisfy
the requirements of this logic. If you think about it, that should be
obvious.

On the real web, many stylesheets disregard this advice, it's true, and
so, cascading an !important user stylesheet with author stylesheets on
real web pages can be hairy anyway. But if we're going to talk about it
at all, we might as well try to get the issues straight, IMHO. I've set
out my best understanding, and this is a problem which AIUI exists even
without background images. Those are an *additional* complicating factor.

[Back to original message]