Почему не корректно отображается svg в IE11?

Question

[krs-front]

<svg width="0" height="0" class="texture-source">
            <defs>
                <path id="figure" d="M977,0v564H0C37.3,260.4,395.4,457.7,544.1,0H977z" />
                  <pattern id="texture" x="0" y="0" width="500" height="500" patternUnits="userSpaceOnUse">
                    <image id="texture-link" xlink:href="img.jpg" width="500" height="500" />
                  </pattern>
            </defs>
        </svg>
        <svg class="index-slider-image hidden-xs hidden-sm" viewBox="0 0 977 564">
            <style type="text/css">
                #figure {
                    fill: url(#texture);
                }
            </style>
            <use xlink:href="#figure"></use>
        </svg>

И стили для него

.index-slider-image {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    height: 500px;
}

Везде работает нормально, кроме IE

Пример корректного отображения:

Comments

[Иван]

"Это IE детка" ответ не устроит? У него всю жизнь все никак у людей.

Answer 1

[Александр]

Он художник, он так видит. Серьезно: просто забей дополнительные стили для ие, не мучайся)