Can someone tell me why the following css is not validating? I've been trying to research this myself with no luck. All of the documentation I've read says this is the proper why to do gradients in css3.
#header {
color: white;
font-size: 12px;
font-family: Helvetica, Verdana, Arial, sans-serif;
background: black;
background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
width: 100%;
height: 35px;
margin-top: 0px;
margin-left: auto;
margin-right: auto;
padding: 10px;
position: fixed;
top: 0px;
z-index: 1000;
}
These are the validation errors I'm getting:
W3C CSS Validator results for TextArea (CSS level 3)
Sorry! We found the following errors (6)
URI : TextArea
6 #header Value Error : background-color
-moz-linear-gradient(top,rgba(0,0,0,0.65 ) 0%,rgba(0,0,0,0 ) 100% ) is not a background-color value :
-moz-linear-gradient(top,rgba(0,0,0,0.65 ) 0%,rgba(0,0,0,0 ) 100% )7 #header Value Error : background-color -webkit-gradient(linear,left
top,left bottom,color-stop(0%,rgba(0,0,0,0.65 )
),color-stop(100%,rgba(0,0,0,0 ) ) ) is not a background-color value :
-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(0,0,0,0.65 ) ),color-stop(100%,rgba(0,0,0,0
) ) )8 #header Value Error : background-color
-webkit-linear-gradient(top,rgba(0,0,0,0.65 ) 0%,rgba(0,0,0,0 ) 100% ) is not a background-color value :
-webkit-linear-gradient(top,rgba(0,0,0,0.65 ) 0%,rgba(0,0,0,0 ) 100% )9 #header Value Error : background-color
-o-linear-gradient(top,rgba(0,0,0,0.65 ) 0%,rgba(0,0,0,0 ) 100% ) is not a background-color value : -o-linear-gradient(top,rgba(0,0,0,0.65
) 0%,rgba(0,0,0,0 ) 100% )10 #header Value Error : background-color
-ms-linear-gradient(top,rgba(0,0,0,0.65 ) 0%,rgba(0,0,0,0 ) 100% ) is not a background-color value : -ms-linear-gradient(top,rgba(0,0,0,0.65
) 0%,rgba(0,0,0,0 ) 100% )11 #header Value Error : background-color
linear-gradient(top,rgba(0,0,0,0.65 ) 0%,rgba(0,0,0,0 ) 100% ) is not
a background-color value : linear-gradient(top,rgba(0,0,0,0.65 )
0%,rgba(0,0,0,0 ) 100% )
Best Answer
This is a duplicate of: CSS background gradient validation
A good explanation is:
http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-understanding-css3-gradients/comment-page-1/#comment-243334