css - Background-size with SVG squished in IE9-10 -
I have a div set with a background image: with the following CSS: Background size is respected in Firefox, Safari and Chrome. In IE8, SVG is replaced by PNG file. However, in IE 9 and IE 10, the size of the SVG file is quite low, the problem is linked to the width and height of the div. If I add height of 150px, then SVG is sung properly. If I shorten it (i.e. 100px) the graphic starts to shrink. Has anyone found any way to fix this problem in Explorer? Is there a way to tell ID to use the background size independently to use the width and height of the div? Make sure that your SVG is specified in
& lt; Div & gt; Play video of lt; / Div & gt;
div {background-image: url ('icon.png'); Background-image: url ('icon.svg'), none; Background-size: 40px 40px; Repeat Background: No Repetition; Background-position: 90% 50%; Padding: 20px; Width: 150px; }
width
and height
if you specify it as Illustrator , Make sure the "Reserved" box is unchecked because this option removes the width and height.
Comments
Post a Comment