CSS hanging-punctuation Property


The hanging-punctuation property in CSS provides web designers some upper hand over typography on the webpage. The hanging-punctuation property specifies whether a punctuation mark is placed outside the line box at the start or at the end of some line of text.

Basically, It provides the web designers to set bullets or any symbols to the specific align either left or right so that the first letter is properly aligned with the rest of the document.

We can use the following keywords along with hanging-punctuation property and can use in different modes or types:

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

  • Keyword values
  • Two Keyword values
  • Three Keyword values
  • Global Keyword values

CSS Syntax

hanging-punctuation: none|first|last|allow-end|force-end|initial|inherit;

Supported Browsers:

  • Firefox: 52.0, 2.0 -moz-
  • Google Chrome: 50.0, 4.0 -webkit-
  • Internet Explorer: 10.0
  • Safari: 9.0, 3.1 -webkit-
  • Opera: 37.0, 15.0 -webkit-, 11.1

Example -