CODEWITHSUNDEEP
svgwebkit
surfthecity
surfthecity

Reputation: 160

SVG <rect> fill works in Chrome not Safari

Can anyone tell me what I am doing wrong with this snippet of SVG? It seems to work fine with Chrome (the rect is blue) but I can't make it appear in Safari or Edge. I guess I am building the element wrong?

<svg width="491" height="473">
    <g class="place-label">
        <rect class="place-label-background" style="width: 92.48px; height: 18px; fill: blue" x="367.757" y="136.259" />
    </g>
</svg>

Upvotes: 1

Views: 767

Answers (1)

Robert Longson
Robert Longson

Reputation: 124249

You need to use attributes for width/height if you want it to work in Safari.

Currently only Blink (i.e. Chrome/Opera) supports width/height as styles, it's a new feature of the SVG 2 specification.

Upvotes: 3

Related Questions