← Back to release summary

Snap border, outline and column-rule widths before layout

Category
CSS
Type
Chromium catches up
Status
Enabled by default (Chrome 109)
Intent stage
Prepare to ship

Summary

Snap border, outline and column-rule widths before layout to avoid gaps between backgrounds and borders caused by paint-time snapping. With this change, Blink will match Gecko and WebKit.

Motivation

Currently Blink snaps the border widths at paint time. This can cause a visible 1px gap between a parent element's border and a child's background when the border is rounded down during paint since the snapping floors the value but the layout rounded it up to calculate the child’s s position (eg border-width is set to 10.75 pixels, rounded to 10px at paint time, but 11 at layout time). By making this change Blink will also behave like Gecko and WebKit and increase interoperability.

Standards & signals

Explainers: https://crisal.io/words/2020/06/13/rounding-borders.html

View on chromestatus.com