Blog / Oplossing voor het verkeerd schalen van SVG bestanden in Internet Explorer

08

februari

2015

8 februari 2015

IE9, IE10 en IE 11 schalen SVG bestanden niet juist wanneer ze zijn toegevoegd middels een img tag als de viewbox, width en height attributen in het SVG bestand zijn gespecificeerd.

Een handige oplossing op basis van CSS is onderstaande code. Het SVG bestand wordt nu proportioneel geschaald op basis van de grootte van zijn container.

/*
* [1] IE9
* [2] IE10+
*/
/* 1 */
img[src*=".svg"] {
width: 100%;
}
/* 2 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
img[src*=".svg"] {
width: 100%;
}
}

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *