Line Breaks in the CSS Content Property

The CSS content property is very useful for generated content in the ::before or ::after speudo-elements. To insert a new line / line break in that content, use the \A escape characters:

article h2::before {
  content: "Killing \A Me \A Softly";
  white-space: pre-wrap;
}

White-space property

In order for the new lines to work properly, you also need to set the white-space property to either pre or pre-wrap.

  Tweet It
✖ Clear

🕵 Search Results

🔎 Searching...