Bernardo
Bernardo

Reputation: 541

CSS Errors/Hacks and W3C Validation

I have the following lines (separate) in a stylesheet I am reviewing:

.Ex1.Ex2 {
color:#333;
font-family:Verdana,Arial,sans-serif;
font-size:9pt;
font-weight:bold;
margin:24px 0 5px;
border-bottom:1px solid #333
}

{
background-color:#ffe;
border:1px solid #aaa;
color:#000;
font-family:Verdana,Arial,sans-serif;
font-size:9pt;
height:auto;
margin-top:5px
}

and

.box_title_container {
height:29px;
width:225px;
margin:0 auto;
background:url(../best_images/boxts.gif);
repeat-x
}

When passing through the W3C Validator both return parsing errors. Since the person who created the stylesheet had much more experience than myself regarding CSS, I might believe that those are two types of hacks for crossbrowsing compatibility, but i couldn't google (it 's a verb now right?) anything related to this.

As for the first line it has two enclosing set of properties and the second has an isolated repeat-x value (and this "error" is repeated across the following 5 or 6 lines).

Could someone tell me if those were made with some sort of purpose or are plain errors?

Thanks in advance!

Upvotes: 0

Views: 520

Answers (1)

Aurélien Grimpard
Aurélien Grimpard

Reputation: 964

In your first CSS block, you must indicate an ID, a class or an HTML element for the second {}

.Ex1.Ex2 {
color:#333;
font-family:Verdana,Arial,sans-serif;
font-size:9pt;
font-weight:bold;
margin:24px 0 5px;
border-bottom:1px solid #333 /* missing ;*/
}

#IDneeded .CLASSneeed {
background-color:#ffe;
border:1px solid #aaa;
color:#000;
font-family:Verdana,Arial,sans-serif;
font-size:9pt;
height:auto;
margin-top:5px /* missing ;*/
}

For the 2nd one, "repeat-x" is a value for "background" not a CSS property, just move the ;

.box_title_container {
height:29px;
width:225px;
margin:0 auto;
background:url(../best_images/boxts.gif) repeat-x;
}

Upvotes: 3

Related Questions