Limited supportLimited browser support. Check compatibility before use.
Other Limited support

Hanging punctuation

The hanging-punctuation CSS property puts punctuation characters outside of the box to align the text with the rest of the document.

Other

Overview

The hanging-punctuation CSS property puts punctuation characters outside of the box to align the text with the rest of the document.

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 puts punctuation characters outside of the box to align the text with the rest of the document.

Cautions

  • Limited browser support. Check compatibility before use.

Accessibility

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

Related links

Powered by web-features