У меня есть div с фоновым изображением:

<div>Play Video</div>

со следующим CSS:

div {
background-image: url('icon.png');
background-image: url('icon.svg'), none;
background-size: 40px 40px;
background-repeat: no-repeat;
background-position: 90% 50%;
padding: 20px;
width: 150px;
}

Размер фона соблюдается в Firefox, Safari и Chrome. В IE8 SVG заменяется файлом PNG. Однако в IE9 и IE10 файл SVG значительно уменьшен. Проблема, кажется, связана с шириной и высотой div. Если я добавлю высоту 150px, SVG будет отображаться правильно. Если я уменьшу его (т.е. 100 пикселей), изображение начнет уменьшаться.

Кто-нибудь нашел способ исправить эту проблему в Explorer? Есть ли способ сказать IE использовать значение background-size независимо от ширины и высоты div?