CSS Validation Warnings

Whilst validating my CSS, i have ironed out all the errors - but the warnings i don't seem to understand.

* {
	margin:0;
	padding:0;
}

body{
	margin:0;
	padding:0;
	line-height: 1.5em;
	background: #dddddd;
}

a, a:hover, a:visited{text-decoration:none; outline:none;}
p{padding-bottom: 5px;}
b{font-size: 110%;}
hr{border-bottom:double #a7a7a7;height:4px;background:none;margin-top:-10px;}

#topsection{
	background-image:url(images/Logo.png);
	background-repeat: no-repeat;
	height: 180px;
}

#name{
	margin-left: 325px;
	padding-top: 75px;
	margin-bottom: 50px;
}

#name a,
#name a:hover,
#name a:active{
	font-size: 45px;
	font-family: Verdana, Sans-Serif;
	color: #8e1f04;
}

#tabMenu {
	margin-top: -6px;
	width:100%;
	float:left;
	list-style:none;
	background-image:url(images/Tab.jpg);
	background-repeat: repeat-x;
	font:normal 14px/16px arial,helvetica,sans-serif;
	border-top: 1px solid #611303;
	border-bottom: 1px solid #611303;
}

#tabMenu li {
	display:inline; /* keep IE happy */
}

#tabMenu a, 
#tabMenu strong, 
#tabMenu span {
	font-size: 11px;
	float:left;
	padding:4px 16px 5px;
	padding-top: 6px;
	padding-bottom: 7px;
	position:relative; /* fix IE depth sorting */
	border-right: 1px solid #611303;
	text-align:center;
	color:#FFF;
	font-weight: bold;
	text-transform: uppercase; 
	height: 100%;
}

#tabMenu a:active,
#tabMenu a:focus,
#tabMenu a:hover {
	background:#c93512;
}

#tabRight a{
	padding-top: 5px;	
	float: right;
	vertical-align: middle;
	height: 100%;
	border: none;
}

#tabRight a:hover{background:none;}

#tabRight img{
	border: none;
	padding-right: 2px;
}

#tabRight b{font-size: 100%;}

#tabRight b:hover{text-decoration:underline;}


#contentwrapper{
	float: left;
	width: 100%;
	margin-bottom: 20px;
}

#contentcolumn{
	padding: 10px;
	padding-right: 0px;
	margin-left: 250px; /*Set left margin to LeftColumnWidth*/
}

.navigate,
.navigate a{
	font-family: Arial, Tahoma, Verdana;
	color: #8e1f04;
	font-size: 12px;
}

#leftcolumn{
	font-family: Arial, Tahoma, Verdana;	
	margin-top: 10px;
	float: left;
	width: 250px; /*Width of left column*/
}

#leftcolumn ul{
	list-style-type: none;
	margin: 0;
}

#leftcolumn ul li h2{
	margin-top: 15px;
	font-size: 16px;
	padding-left: 15px;
	border-bottom: double #a7a7a7;
}

#leftcolumn ul li{
}

#leftcolumn ul ul li{
	background-image:url(images/Sidebar.png);
	background-repeat: no-repeat;
	font-family: Arial, Tahoma, Verdana;
	padding: 0;
	padding-top: 4px;
	margin-bottom: 4px;
	padding-left: 23px;
	font-size: 11px;
	color: #8e1f04;
	line-height: 1.4em;
}

#leftcolumn a{
	color: #8e1f04;
}

#leftcolumn a:hover{
	color: #000;
	text-decoration: underline;
}

#footer{
	font-family: Arial, Tahoma, Verdana;
	font-size: 12px;
	font-weight: bold;
	clear: left;
	width: 100%;
	padding: 4px 0;
	text-align: center;
	background-color: #8e1f04;
	color: #FFF;
}

#footer a{
	color: #FFF;
}

#footer a:hover{
	text-decoration: underline;
}

.innertube{
	margin: 15px; /*Margins for inner DIV inside each column (to provide padding)*/
	margin-right: 0;
	padding-top: 10px;
	margin-top: 0;
}

.post{
	font-family:Arial, Tahoma, Verdana;	
	line-height: 1em;
	margin-bottom: 20px;
}

.post-info a{
	color: #8e1f04;
}

.post h2 a{
	font-size: 16px;
	line-height: 1.1em;
	color: #8e1f04;
}

#archive-category{
	font-size: 20px;
	text-align: center;
}

#sidebar-search{
	background: #ffeff4;
	border: 1px solid #ffb7b7;
	padding-bottom: 5px;
}

#sidebar-search h4{
	font-family: Arial, Tohama, Verdana;
	font-size: 14px;
	font-weight: bold;
	padding-left: 15px;
	text-decoration: none;
	color: #8e1f04;
}

#searchform{
	padding-left: 10px;
}

#searchsubmit{
	font-size: 12px;
	padding: 2px;
	font-family: Arial, Tahoma, Verdana;
	font-weight: bold;
	background-image:url(images/Tab.jpg);
	background-repeat: repeat-x;
	border: 1px solid #000;
	color: #FFF;
	outline:none;
}

#searchsubmit:active,
#searchsubmit:hover,
#searchsubmit:focus{
	background:#c93512;
}

#s{
	border-top: 1px solid #666666;
	border-right: 1px solid #DDDDDD;
	border-left: 1px solid #666666;
	border-bottom: 1px solid #DDDDDD;
	font-family: Arial, Tahoma, Verdana;
	font-size: 13px;
	padding: 2px;
}

#maincontainer{
	margin: 20px;
	background: #FFF;
	border: double #a7a7a7;
}

#content-wrapper{
	margin: 15px;
}

.widget_calendar caption{
	text-align: center;
	color: #8e1f04;
}

.widget_calendar td{
	font-size: 11.5px;
	text-align: center;
	color: #8e1f04;
	padding-left: 3px;
	padding-right: 3px;
}

.widget_calendar{
	width: 250px;
}

.widget_text .textwidget{
	font-size: 11px;
	color: #8e1f04;
	line-height: 1.4em;
	padding-left: 13px;
}

.content{font-size:12px;}

.post-info{font-size:12px;font-weight:bold;}

.more-link{color:#8e1f04;}

#title{text-align:center;font-family:Arial,Tahoma,Verdana;font-size:20px;color:#8e1f04;text-decoration:underline;}

.comments{font-family:Arial,Tahoma,Verdana;font-size:12px;margin-top:10px;}

.comments h3{margin-bottom:10px;font-size:12px;color: #8e1f04;}

.commentmetadata{font-weight:bold;}

.commentmetadata a{color:#8e1f04;}

Code (markup):

I don't understand what it means, as color and background-color are different in my eyes.

Any help fixing so i know for the future?

 

If the color and background color aren't the same and you know it then ignore those.

 

So I can say it is valid CSS?

 

Well, what does it say so on the page?

 

It just says warnings(22) then lists them. It then gives the valid CSS information.

 

What that means is that it would be possible for your text to be the same color as the background of a container element.

For instance

309 Same colors for color and background-color in two contexts #footer and .comments h3

Code (markup):

If you had a ".comments h3" element inside a "#footer", you wouldn't be able to see the text.

It's determined using only what's known from the CSS. The validator doesn't know if these situations will ever actually occur or not, but it makes sure to warn you that it's possible.