[css-values?] Accept <number> where <integer> is expected

[LeaVerou]

Currently there are a lot of places where authors end up having a <number> instead of an <integer> without realizing, then are puzzled why their code doesn't work.

For example:

--columns: 12;
grid-column-end: span calc(var(--columns) - 8); /* works */
grid-column-end: span calc(var(--columns) / 3); /* fails, IACVT */

Same issues with counter-reset, z-index and the list goes on.

In fact, clever authors have even come up with terrible hacks for working around this by assigning the number to a registered <integer> property and taking advantage of that implicit conversion. Sure, once floor() and friends are supported this would be much simpler, but IMO authors should not even have to think about this. A 5 is a 5, whether it was generated as 4 + 1 or as 15 / 3. Since <number> cannot be disambiguated from <integer>, I doubt we have any syntax that depends on them being incompatible.

Proposal: accept <number> anywhere an <integer> is accepted, after flooring (or rounding, no strong opinion).

[Loirooriol]

The spec already says

csswg-drafts/css-values-4/Overview.bs

Lines 4160 to 4162 in 9a5895f

	Additionally, [=math functions=] that resolve to <<number>>
	can be used in any place that only accepts <<integer>>;
	the value is [=rounded to the nearest integer=] as it resolves.

[emilio]

Yeah, this already works per spec. Firefox implements it correctly afaict, not sure about other browsers, but we have tests for this.

[LeaVerou]

Yeah, this already works per spec. Firefox implements it correctly afaict, not sure about other browsers, but we have tests for this.

Ah, thanks, must be a Chrome bug then. By "we" you meant csswg tests or Gecko tests?

[Loirooriol]

Chromium was recently fixed in https://crbug.com/931216
There are tests in WPT, like https://wpt.fyi/results/css/css-values/calc-rounds-to-integer.html