Home > Back-end >  SVG text and white-space:pre compatibility
SVG text and white-space:pre compatibility

Time:02-02

This SVG text will be displayed in 2 lines on Firefox, but in just 1 line on Chrome:

document.querySelector("text").textContent = "This is the first line \n This is the second line";
text {
  white-space: pre;
}
<svg>
  <text x="10" y="50"></text>
</svg>

Is there any reliable source describing the current compatibility of white-space: pre; in an SVG text with newline characters? I've looked at MDN, Caniuse etc. but couldn't find anything.

(by the way I believe there's nothing in the specs and Firefox implementation decided to do that independently, is that correct?)

CodePudding user response:

  • white-space was not an SVG property in SVG 1.1
  • white-space is an SVG property in SVG 2 and should work as it does with HTML text
  • only Firefox has implemented this part of the SVG 2 specification so far
  • Related