1875316 - 0 invalid without unit in functions

Status: RESOLVED INVALID

(Core :: CSS Parsing and Computation, defect)

Description

[jz]

Steps to reproduce:

try using the number zero without a unit in a css function like max or min https://codepen.io/jz/pen/JjzNXXp

Actual results:

the entire expression becomes invalid

Expected results:

i'm not completely sure based on my reading of the spec, but I think bare zero should work exactly the same as zero with any unit, like 0px or 0rem

This works the same way in Firefox and Chrome, so maybe it's working as it's supposed to? but definitely confusing for developers, and especially problematic because css optimizers will often try to remove the unit from zero during minification

Comment 1

[Emilio Cobos Álvarez [:emilio]]

This is invalid per spec indeed. https://drafts.csswg.org/css-values-4/#lengths has:

if a 0 could be parsed as either a <number> or a <length> in a property (such as line-height), it must parse as a <number>.

In calc() and such functions, numbers are always valid, so 0 is a number and not a length.

Comment 2

[jz]

thanks for looking! i don't completely follow - it seems like the browser could be unambiguously interpreting what the 0 means in this context - like in my codepen example the unit for 0 could be inferred from the other operand - but since all browsers have implemented this the same way I'll assume you all know what you're doing! thanks for your review.

now I guess I'll have to figure out which css optimizer plugin repo to file a bug in to get them to stop removing the units from 0 inside functions...