Как заменить тег, который не отображается в SVG на некоторых браузерах и в телефонах?

Question

[Volgarastraport]

Сделал простенький лендинг football-priz.club (код скриптов доступен)
В хроме на десктопе и в Андроиде все ОК.
В Мозиле отвалились иконки на колесе. В IE - вообще нет колеса. На айфонах тоже самое - нет колеса.
Грешу на отсутствие height или width (https://developer.mozilla.org/ru/docs/Web/SVG/Tuto...
Но как их захаркордить, если верстка адаптивная?
Прошу помочь.

Comments

[tyzberd]

смотрю вы поменяли xlink:href на href.
Проблема в нем?

[Volgarastraport]

tyzberd, На картинках? Ничего не поменял - xlink и стоит.
В общем с картинками решил, нужно было приписать ширину и высоту - так работает, но вообще SVG не воспроизводится на iOS и IE в десктопах.

[tyzberd]

для свг спрайтов в IE есть https://github.com/jonathantneal/svg4everybody возможно тут та же проблема.

[tyzberd]

не воспроизводится на iOS

на реальном устройстве проверяете?

[tyzberd]

и IE в десктопах

в IE9+ все норм, у вас просто ошибка в js, исользуется arrow function и доктайпа нет

setTimeout(() => {
        switchClass();
    }, 3000);

+ для svg можете добавить xmlns="www.w3.org/2000/svg"
xmlns:xlink="www.w3.org/1999/xlink">

[Volgarastraport]

tyzberd, Спасибо, действительно в этом был затык. Вчера ещё эту ошибку увидел, но проигнорил.