t32k/stylestats

Should float:none be reported?

bartveneman opened this issue · 5 comments

Just wondering if float: none should be reported as a float property, as this value doesn't tend to break a layout as left or right would. Perhaps it's too confusing to leave it out, but I was just wondering if this was ever considered.

CSSLint, on which the directives/hints on the details page are based, checks for the declaration value being 'none': https://github.com/CSSLint/csslint/blob/master/src/rules/floats.js#L23

Do you mean in the properties count?

The Properties Count is the number of property declarations.

I don't think property values should play a role here. If CSSLint ignores float:none it is because the purpose of this tool (for some reason) is to report how many elements are "floated" (left or right).

I'm talking about Float Properties: https://github.com/t32k/stylestats/blob/develop/lib/analyzer.js#L190. I think the point of counting them separately is because floats can have unexpected side-effects. Another assumption of mine is that float: none shouldn't have to be counted in this case as it doesn't have unexpected side-effects like float: right or float: left could have. And because the StyleStats.org page shows info boxes with links to CSSLint and CSSLint doesn't consider float: none as harmful I thought it might be worth considering to check for the float's value, before incrementing the counter.

Your assumption seems to be that float:left or float:right can have unexpected side-effects, but not float:none—and also that CSSLint doesn't consider float:none as harmful.

Here is my thoughts:

  • as I suggested earlier, CSSLint is about counting how many elements are floated and float:noe does not float an element.
  • a style is only harmful when not properly used. i.e. float:left has no side-effect unless you call what this style implies (block-formatting context, margin collapsing, out-of-flow) side-effects. In other words, it may be harmful if it is applied to an element when it should not be, but that's also true for float:none applied to an element that is supposed to be "floated".
  • finally, even counting floats (as CSSLint does) does not mean all elements are floated as what counts is the computed value of a property.

To better understand the last point, imagine this:

div {
  position:absolute;
  float:left;
  right:0;
}

The box would be aligned to the right, not to the left; this shows that the computed value of float is none. I'm saying this to point out that these tools are only parsing style sheets; they can't tell you what's harmful and what's not—what's useless and what's not.

Thanks for the elaborate feedback @thierryk!

as I suggested earlier, CSSLint is about counting how many elements are floated and float:noe does not float an element.

That's a fair point.

they can't tell you what's harmful and what's not—what's useless and what's not.

And that's the point I'm trying to make. StyleStats.org is showing hints about universal selectors and unqualified selectors being a potential issue and linking to the CSSLint docs for explanation, but for the floats count it doesn't (and others, but that's not what this issue is about).

Let me try to summarise: counting floats, regardless of value, can be misleading as it doesn't necessarily mean that this will be the computed style for the element. StyleStats is counting all floats because of this.

I guess that's my question answered 😄