Trying to understand CSS in general

[Carneno]

Hello, I'm trying to understand CSS in general and some of the CSS used by a downloaded prebuilt theme which has a Style.css. Is it using CSS 2.1? My VS 2010 environment shows the style.css as CSS 2.1 and some of the properties have a green squiggly line under them with a hover message of "Validation (CSS 2.1): 'text-shadow' is not a known CSS property name". Those are CSS 3 properties. When I look at the body element in the Style.css, it seems to have two color properties for the background. It has the "background:#7692B9;" and then the "background: #bbc9dc url('img/background.png') top repeat-x;"body{font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif;font-size:12px;background:#7692B9;color:#3A4045;background: #bbc9dc url('img/background.png') top repeat-x;} What is the purpose of having the background color property in both places when in fact the image "url('img/background.png')" for the background has it's own color? Or is my interpretation screwed up. Any help would be gratefully appreciated. Thanks,Tony

Edited November 9, 2012 by Carneno

[niche]

Have you done the css tutorials?

[Ingolme]

The second background rule is overriding the first one. The background color is meant to be displayed before and while the image is loading, and also for if the image isn't found. The color should be there to make the text in front of it visible when the image hasn't loaded. text-shadow is a CSS 3 property. It is not valid CSS 2.1, but it was valid in the short-lived CSS 2. The version of CSS doesn't matter much, all that matters is what properties browsers support and how old of a browser you're planning to support.

[Carneno]

Have you done the css tutorials?

Yes I did. Thanks,Tony

[Carneno]

The second background rule is overriding the first one. The background color is meant to be displayed before and while the image is loading, and also for if the image isn't found. The color should be there to make the text in front of it visible when the image hasn't loaded. text-shadow is a CSS 3 property. It is not valid CSS 2.1, but it was valid in the short-lived CSS 2. The version of CSS doesn't matter much, all that matters is what properties browsers support and how old of a browser you're planning to support.

OK Thanks. I have a better understanding now of why it was done that way. Tony