The CSS line-height-step property provides an ability to round the heights of line boxes to the multiple of the specified length. This property allows authors to control vertical rhythm.

Demo

• https://drafts.csswg.org/css-rhythm/examples/snap-height.html

Documentation

• https://developer.mozilla.org/en-US/docs/Web/CSS/line-height-step

Specification

Specification link

Status: Specification currently under development in a Working Group

Status in Chromium

Blink components: Blink>Layout

Implementation status: In developer trial (Behind a flag) (tracking bug)

Consensus & Standardization

• Firefox: In development
• Edge: No signal
• Safari: Positive
• Web Developers: Positive

Owner

• kojii@chromium.org

Comments

This spec was originally called "snap-height", then renamed to "snap size", and to "step sizing". Renamed to "CSS Rhythmic Sizing" in Jan 2017.

Search tags

Last updated on 2020-11-19