v146 · CSS · text-indent
text-indent: hanging and each-line keywords
Chrome 146 adds support for the optional hanging and each-line keywords for the text-indent CSS property. These keywords extend first-line indentation to hanging punctuation and to every paragraph line that follows a hard line break.
concepts
-
Hanging Keyword Demo
The
hangingkeyword inverts the indent: all lines except the first are indented. Classic hanging indent for bibliographies, poetry, and bullet-style copy where the lead text protrudes left. -
Each-Line Keyword Demo
The
each-linekeyword applies the indent after every hard line break (<br>, forced newline in a pre element) in addition to the first line. Compare with default behaviour where only the very first line is indented. -
Print typography presets
Five real typesetting traditions — novel, manuscript, bibliography, dialogue, web — packaged as
text-indentpresets. Switch presets and watch a styled page recompose in place. -
Live Indent Editor
Combine
text-indentlength,hanging, andeach-linekeywords interactively. Adjust indent depth and font size, toggle each keyword, and watch multi-paragraph text with forced line breaks update in real time.
why it shipped
The CSS Text Module Level 3 specification defines text-indent as accepting an optional length, followed by optional hanging and/or each-line keywords. Chrome previously only supported the length value. Chrome 146 adds the two keywords, achieving spec compliance and parity with other engines that already support them.
the API
/* Default: only the first line of the block is indented */
p { text-indent: 2em; }
/* hanging: all lines EXCEPT the first are indented.
(The first line "hangs" out to the left.) */
p { text-indent: 2em hanging; }
/* each-line: the first line AND lines after hard line breaks are indented.
Soft-wrapped continuation lines are not indented. */
p { text-indent: 2em each-line; }
/* Both keywords can be combined */
p { text-indent: 2em hanging each-line; }