Limited support Limited browser support. Check compatibility before use.

Hanging punctuation

The hanging-punctuation CSS property specifies whether a punctuation mark should hang at the start or end of a line of text. Hanging punctuation may be placed outside the line box.

Other

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
hanging-punctuation
Preview
10
allow-end
10
10
first
10
10
last
10
10
none
10
10
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 2 item(s)
Limitation
  • This browser only partially implements this feature
Implementation note
  • The characters `U+0027` and `U+0022` are not supported by the `first` and `last` keywords. See bug 309123.
Notes 2 item(s)
Limitation
  • This browser only partially implements this feature
Implementation note
  • The characters `U+0027` and `U+0022` are not supported by the `first` and `last` keywords. See bug 309123.

Syntax

CSS 
p {
  hanging-punctuation: first last;
}
blockquote {
  hanging-punctuation: first allow-end;
}

Live demo

first last

CSS First last demo.

PreviewFullscreen

first allow-end

CSS First allow-end demo.

PreviewFullscreen

Normal comparison

CSS Normal(comparisonuse) demo.

PreviewFullscreen

Use cases

  • Using Hanging punctuation

    The hanging-punctuation CSS property specifies whether a punctuation mark should hang at the start or end of a line of text.

Cautions

  • Limited browser support. Check compatibility before use.

Accessibility

  • Make sure visual changes are conveyed appropriately to assistive technology.

Related links