incorrect broken box-sizing warning

[patrickkettner]

When using the universal selector to declare box sizing, ala Paul Irish's http://paulirish.com/2012/box-sizing-border-box-ftw/, I don't think that there should be any "Beware of broken box size" warnings.

[nzakas]

I'm not sure what this means. Can you give an example of the code that you're using, the result that you're getting, and what you expect?

[patrickkettner]

Sure!

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.foo { width: 200px; padding: 10px}

outputs

Using width with padding can sometimes make elements larger than you expect.
.foo { width: 200px; padding: 10px}

Since the * selector also selects .foo, it should not give this warning.

[nzakas]

That's an interesting case. Thanks, I'll take a look at that.

[stubbornella]

Eek, this falls into a weakness of CSS Lint. If you use multiple selectors to target the same element we do not know that they go together. For example:

.message{}
.error-message{}

<div class="message error-message">

How difficult would it be to make an exception for the * selector @nzakas, since it applies to everything?

[barraponto]

@stubbornella it's not actually a weakness. you can't expect .message and .error-message to always select the same stuff, since we're talking about group union, nor group intersection.

yet * should be supported, indeed.