SVG on Safari

There is a bug with displaying SVG on Safari.

The fix is to wrap SVG in object.

<object>
                <svg  xmlns="http://www.w3.org/2000/svg" version="1.1"></svg>
</object>

CSS

object {
    width: 100%;
    display: block;
    height: auto;
    position: relative;
    padding-top: 100%;
}

svg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

Leave a Reply

Your email address will not be published. Required fields are marked *