w3c / w3c/csswg-drafts

[css-values] Clarifying serialization of negative zero and expression simplification

Open
#9,750 11 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Closed Accepted by CSSWG Resolution css-values-4 Needs Edits Needs Testcase (WPT)
Dominant language
Bikeshed
Stars
4.9k
Forks
816
PR merge metrics
PR metrics pending

Description

Recently I was discussing with @emilio how signed zeroes should be serialized in calc expressions, and couldn't find a clear answer in the spec.

For example, an expression like max(1% / -infinity, 0%) which should simplify to max(-0%, 0%). Without knowing if the percentage basis is positive or negative, it can't be simplified further since zeroes of different signs are not considered equivalent in min/max functions.

It looks like currently Chrome and Firefox serialize this as max(0%, 0%) while Safari does calc(0%). I'm not sure which one of these is correct. max(-0%, 0%) is perhaps another possibility.

I found two parts of the spec that look to be relevant.

The serialization steps mention infinities and NaN but don't have any explicit instructions for negative zero. The numeric value should be clamped to the allowed range, but the allowed range may include negative values.

10.9.1. Infinities, NaN, and Signed Zero mentions that if a top level calculation simplifies to a negative zero, it should be "censored into a standard representable value".

Could that apply here? The example expression doesn't fully simplify, but the only two possible resulting values would be equivalent to 0%, so calc(0%) seems reasonable in this case.

But I'm not sure if that would work if there are additional arguments. Would it also be ok to simplify something like max(-0%, 0%, 1%) to max(0%, 1%) if it's the top-level expression? Does it make sense in general to eliminate duplicated values? Safari serializes max(1%, 1%, 1%) as calc(1%), while Chrome and Firefox keep max(1%, 1%, 1%).

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reading the CSS Values and Units specification sections on calc serialization and infinities, NaN, and signed zero. Compare the issue's max() and duplicate-value examples with the reported Chrome, Firefox, and Safari serialization; done means reaching and documenting an agreed serialization rule in the spec.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
documentation
Issue type
Documentation
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.