CSS Color Overlapping

Is it common to have a lot of these warnings in CSS validation results:
You have no background-color set (or background-color is set to transparent) but you have set a color. Make sure that cascading of colors keeps the text reasonably legible.

I get this error with this code

Do I really need to state a background color when the the <h>s look fine on the site and the background color for the whole main section that ises these <h>s is already set?



Yeah, I’m not so convinced by those warnings, but I assume it’s to let you know that if the background color/image fails for any reason, the text won’t be easily seen on the background color of the next element up the line. It’s easy enough to set a bg color on those elements that matches the bg color of the container, so if the warnings bother you, it’s easy to get rid of them.

I think I’ll leave it.

Thanks Ralph,


I wonder if it’s better to have those benign errors causing those warnings. If you code for every background color for every tag, image etc. and one day there’s a problem with one of these tags/images not showing, instead of seeing a black rectangle, you’ll see the same color as the rest of the backround, making the “not showing” tag/image much less noticeable. That raises the question: which would you rather have, a black rectangle or a missing tag/image than might not be noticed for a while?

An opinion.

Requiring a background-color whenever a text color is applied seems more like a “best practice”. Failing to include a background-color does not cause css to malfunction. So, a “best practice” warning, perhaps, but hardly a css error, in my opinion. Will they ever “break” in a browser. Can’t imagine it happening.

I’m not aware of a requirement to give images a background-color. (Emphasis on “not aware”. Is this an HTML5 expectation?) Missing images can easily disappear without a trace today. Depends on their {display} characteristic AND the browser.

Personally, I tend to clean up all validation errors. In that way, significant errors catch my eye more easily and are not apt to be overlooked because of the company they keep. However, all are not “critical”. Unmatched html tags, yes; various others including background colors, no.

How many tags are you including in your question?

The first time I because aware of this issue was reading Zeldman’s Designing with Web Standards book some years ago. I have to admit I haven’t followed this practice much. But I can imagine a situation like this where it might matter:

Say you have black text in your content area, and a white background image on that content area, but no background color set. And on the bosy element you have a background color of black. If for any reason the white background image on the content area were not to load (if you have images off, for example) you’d have black text on a black background. I assume that’s the reason for the warning, but not sure, as I admit I’ve never gotten around to following up on this issue.

Yeah that’s why I think leaving those warnings in palce can be of use - the only way the black backgrounds can occur is when there’s a more significant error.