Jump to content

CSS Validator


Little Goat

Recommended Posts

Hi, I have a css file and I ran it through the validator and made it valid, except for warnings.It says stuff like no color for background-color: when I do have one. :):) CSS:

/* whole document */body{background:url(gradientturquoise.jpg);}div{float:left; margin:1px;}/* end Whole *//* Links Column */#links a, #links a:hover, #links a:link, #links a:visited, #links a:active{text-decoration:none; margin-bottom:1px; width:100%; background-color:#222222;}#links a:link  {color:#ffffff;}#links a:visited  {color:#cccccc;}#links a:hover  {color:#f0f0f0; text-decoration:underline; background-color:#666666;}#links a:active  {color:#000000;}div#links{width:20%; background-color:#000000; height:100%; overflow:visible; font-size:125%;}#links h2{background-color:#c0c0c0; color:#333333; text-align:center; margin-bottom:1px;}/* end Links *//* Header */div#head{text-align:center; width:100%; height:128px; background:url(music011.gif); font-family:bradley hand ITC,forte;}div#head h1{font-size:500%; color:white;}/* end Header */div#content{background-color:#eeeedd; height:100%; overflow:visible;}div#container{width:100%; height:100px; overflow:visible;}

can anyone please help?thnx, LG

Link to comment
Share on other sites

Yes, Just putt a color that is almost the same color in the background imageSee if that works.It will help when the user has images disabled, or something like that.In reality you specified the background-image: ###### ;but the background-color: Is not specified ;

Link to comment
Share on other sites

When ever you set a color for something you should also set the background color too and vis versa. :)There are quite a few times where you only specify one or the other.You have to do this as you dont know what default colors the user will have set in there browser and if you dont specify a color it uses the browsers default color.

Link to comment
Share on other sites

Yeah that's really annoying because I want these elements to have the background colour of the body. By having to give all of them their own background marrs the convenience of css of being able to adjust only one factor. And the css validator doesn't recognise "transparent" as a background-color.I'm getting another warning that comes up whenever I specify text-align. "This property applies to block-level elements."

Link to comment
Share on other sites

use:background-color: inherit;.. now background color is inherited from parent element

That worked great. Thanks.Now about when you use the validator, for XHTML validation, when it is validated, a big green sign appears saying "Valid Strict XHTML 1.0!" or something. Should I be expecting the same thing from the CSS validator because all I get is "No error or warning found" followed by this message, "To work as intended, your CSS style sheet needs a correct document parse tree. This means you should use valid HTML," which doesn't seem to say anything bad about the stylesheet. Is my CSS validated or do I need to so something else?
Link to comment
Share on other sites

It should still say validation passed like in this page here.

Link to comment
Share on other sites

I don't get any errors, but it doesn't say my css is validated.Here it is. Can you see anything wrong, which would prevent validation?

/*CONTENT STYLES*/body   {   background-color:#88FFFF;   color:#000010;   }p   {   font:85% sans-serif;   text-align:justify;   }p.update   {   font-size:60%;   text-align:right   }p.turnpage   {   text-align:center   }h1   {   font-family:sans-serif;   }h2   {   color:#333333;   background-color:inherit;   font:900 130% sans-serif;   }h3   {   color:#444477;   background-color:inherit;   font:800 85% sans-serif;   }h4, caption   {   color:#100010;   background-color:inherit;   font:800 80% sans-serif;   text-align:center;   }a:link   {   color:#004080;   background-color:inherit;   font-family:sans-serif;   }a:visited   {   color:#006060;   background-color:inherit;   font-family:sans-serif;   }a:hover, a:active   {   color:#001010;   background-color:inherit;   font-family:sans-serif;   text-decoration:none;   }li   {   color:#000010;   background-color:inherit;   font:85% sans-serif;   }dd   {   color:#000010;   background-color:inherit;   font:85% sans-serif;   }dt   {   color:#000010;   background-color:inherit;   font:600 85% sans-serif;   margin-top:15px   }tr   {   background-color:inherit;   color:#000010;   font:85% sans-serif;   }.turnpage   {   margin: 0 auto;   text-align: center;   }img   {   border-style:none;   margin:0 0;   }/*------------------------------------------------------------------------------------------TEMPLATE STYLESDivision ids*/#cladding   {   width:90%;   }#logo   {   background-color:#FFFFFF;   background:url("img/logo.gif");   color:#000000;   width:100px;   height:100px;   float:left;   }#title   {   background-color:#FFFFFF;   color:#000000;   height:100px;   margin-left:100px;   }#nav   {   border-top:1px solid;   float:left;   width:100px;   min-height:450px;   }#content   {   margin-left:100px;   border-left:1px solid;   border-bottom:1px solid;   border-top:1px solid;   padding:10px;   min-height:450px;   }#turnpage   {   clear:both;   text-align:center;   }#footer   {   clear:both;   font-family:sans-serif;   font-size:65%;   }/*----------------Text ids*/#chapter   {   margin:8px 0px 2px 10px;   text-transform:uppercase;   }#page   {   margin:0px 0px 0px 10px;   }#copyright   {   float:left;   }#update   {   float:right;   }/*---------------Image ids*/#frontbtn, #xhtml   {   margin-top:30px;   }#debbtn, #scibtn, #cycbtn, #safbtn, #accbtn, #appbtn   {}#css   {}#next, #prev   {   margin-bottom:5px   }#footlogo   {   height:60px   }

Link to comment
Share on other sites

I don't get any errors, but it doesn't say my css is validated.

It will say: No error or warning foundIt means it is validated.If there is warnings it will list them.I'd check Your code and there is no errors or warnings, so it is very validated now! :)Copypaste code there:http://jigsaw.w3.org/css-validator/#validate-by-input(Validate by direct input) and You can see it Yourself.
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...