CODEWITHSUNDEEP
css
Leo
Leo

Reputation: 4438

Expecting RBRACE? What is CSS Lint talking about?

CSS Lint thinks there is something wrong here. And so does the W3C CSS Validator. They are probably right and I am wrong, but can someone please help me understand why this is wrong?

CSS:

.my-class {
    width:  calc(((100% - 15%) / 3 - 1px) * 3 + 10%); /* for 3 columns */
}

Error message:

Expected RBRACE at line 2, col 22.

By the way, browsers seem to be more on my side.

Upvotes: 6

Views: 28935

Answers (3)

Sumner Evans
Sumner Evans

Reputation: 9155

Per this article it seems that calc() isn't supported very well.

2 years ago

The parser does not support calc()

It seems like it is sort of fixed, but not entirely.

Upvotes: 1

Leo
Leo

Reputation: 4438

It seems to be a problem with CSS Lint currently. Just a bit of bad parsing.

CSS3 calc is however still not a recommendation by W3C, but it looks very likely to be a standard soon. A warning would be the appropriate message from CSS Lint, of course.

Upvotes: 3

Itay Grudev
Itay Grudev

Reputation: 7444

This is probably caused by the fact that arithmetics is an experimental feature of CSS and is certainly not in any of the CSS Specifications.

Those services are created according to CSS specifications and no wonder they found an error in your code. The entire statement is invalid according to the specs.

Upvotes: 0

Related Questions