CODEWITHSUNDEEP
internet-explorersvgwhitespace
Chetan
Chetan

Reputation: 2756

SVG text element with whitespace not preserved in IE

I want to preserve the white space in a single SVG < text> element.

This works fine with xml:space="preserve" attribute in the text element in all but IE browser.

  <text x="0" y="15" fill="red" xml:space="preserve">I     love     SVG!</text>

Here is the jsfiddle, try to open this fiddle in Chrome/Firefox and in latest IE, notice that whitespace in the text element text is not preserved in IE.

jsfiddle

Any workaround so that this works in IE as well?

Upvotes: 11

Views: 10848

Answers (2)

David
David

Reputation: 91

If you are using d3 this works well: 

.attr("style","white-space:pre")

Upvotes: 8

Robert Longson
Robert Longson

Reputation: 124089

I guess you could replace each space by &#160; (that's the unicode non-breaking space character).

In javascript it would be written as \u00A0 though.

Upvotes: 24

Related Questions