w3c/csswg-drafts

[cssom-view] Layout dimension that divides+rounds+sums to value different to original dividend

Open

#1,211 opened on Apr 13, 2017

View on GitHub
 (4 comments) (0 reactions) (0 assignees)HTML (3,546 stars) (545 forks)batch import
Help Wantedcssom-view-1

Description

Is there any specification for HTML layout dimensions that divide, round and sum to a value greater than the original dividend?

For example

  • A container has two columns.
  • Both columns are 50% the width of the parent.
  • The width of the container is 9 pixels.
  • How wide should each column be?

Major web browsers handle this differently;

Browser First Second element.offsetWidth Aliases †
Chrome 5 4 5 and 4 respectively No
Safari 5 4 5, even for the 4px column No
Firefox 4.5 4.5 rounded to 5 Yes
Edge 4.5 4.5 rounded to 5 Yes

† Allows element boundaries to be mid-pixel, causing that pixel to be aliased based on the two elements that it straddles.

row height screenshots column width screenshtos

Test cases

The specification for offsetWidth only says that offsetWidth must be an integer. Is this specified elsewhere? Should it be?

Is this the correct place to discuss?

Contributor guide

Tech stack
None
Domain
frontend
Issue type
research
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
4
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
CSS layout basicsCSSOM specificationUnderstanding of offsetWidth
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
20
Research direction
This issue seeks clarification on how CSSOM layout dimensions should handle rounding and summing when percentages yield fractional values. A contributor could analyze the current CSSOM spec for offsetWidth (https://drafts.csswg.org/cssom view/#dom htmlelement offsetwidth) and compare browser behaviors documented in the issue. Then propose a spec amendment to define a consistent algorithm. The test cases at https://github.com/BevanR/5 and 5 is 9/ provide practical examples to validate any proposal.
[cssom-view] Layout dimension that divides+rounds+sums to value different to original dividend · w3c/csswg-drafts#1211 | Good First Issue