Jump to content

Validator doesn't like text-align


Glom
 Share

Recommended Posts

When I try to validate my stylesheet, I intermittantly get warnings that, where I haved used text-align, "This property only applies to block-level elements".The weird thing is that it does not happen every time. Only some times.

Link to comment
Share on other sites

It happens when you use it on elements that aren't displayed as a block.http://www.w3.org/TR/2004/CR-CSS21-2004022...ml#display-propIf it's not a block, there's no left, right and middle to it, because it will just wrap around the text, so no reason to use text-align. You must have used text-align on an element that is by default displayed as something else than block...

Link to comment
Share on other sites

/*CONTENT STYLES*/body   {   background-color:#88FFFF;   color:#000010;   }p   {   font:85% sans-serif;   }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;   }img   {   border-style:none;   margin:0 0;   }.pic   {}/*------------------------------------------------------------------------------------------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;   text-align:justify;   }#turnpage   {   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   {}#prev, #next   {}#footlogo   {   height:50px;   }

Link to comment
Share on other sites

<caption> is not a block level element. You will need to split up that piece of code and remove text-align from the caption class.Having text-align for h4 is fine but not when you are assigning the same attributes to h4, caption at the same time.

Link to comment
Share on other sites

h4, caption { color:#100010; background-color:inherit; font:800 80% sans-serif; text-align:center; }That's the problem, I guess?EDIT: Yeah...

Edited by Jonas
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
 Share

×
×
  • Create New...