w3c css validator parse error

Question

I am getting a unusual error. Trying to remove the last of my w3c erros in css and am left with the following :

.2-col-width-left { float:left; margin-top:10px; width:63%; }
.2-col-width-right { padding-top:10px; float:right; width:37%; text-align:right; }
.3-col-width-left { float:left; margin-top:10px; width:60%; }
.3-col-width-right { padding-top:10px;float:right; width:40%; text-align:right; }
.4-col-full { padding:5px 0; width:100%; text-align:center; }
.4-col-title { margin-top:10px; width:100%; }

I am getting a PARSE ERROR but have no idea why. Have googled but with no luck. Any suggestions?

Community · Accepted Answer · 2017-05-23 10:31:48Z

2

The issue is that your selectors are starting with numbers. Your selectors should only begin with a letter or escaped number. See here for more details:

http://www.markinns.com/articles/full/using_numbers_as_css_class_or_id_values

And

Which characters are valid in CSS class names/selectors?

edited May 23, 2017 at 10:31

CommunityBot

11 silver badge

answered Mar 21, 2014 at 22:20

Dryden Long

10.2k2 gold badges38 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

memyselfandmyiphone Over a year ago

opps, now i feel stupid. Thanks, I will accept when it lets me!

Dryden Long Over a year ago

@AlbaClan Nothing to feel stupid about, this rule is not the most obvious and if it weren't for the fact I'd made the same mistake before, I would have had no clue.

Oriol · Accepted Answer · 2014-03-21 22:42:54Z

The problem is that, according to the CSS spec,

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item).

But you can escape them. Just add \00003 before the number at the beginning:

.\000032-col-width-left { float:left; margin-top:10px; width:63%; }
.\000032-col-width-right { padding-top:10px; float:right; width:37%; text-align:right; }
.\000033-col-width-left { float:left; margin-top:10px; width:60%; }
.\000033-col-width-right { padding-top:10px;float:right; width:40%; text-align:right; }
.\000034-col-full { padding:5px 0; width:100%; text-align:center; }
.\000034-col-title { margin-top:10px; width:100%; }

Collectives™ on Stack Overflow

w3c css validator parse error

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related