SVG-пути не отображаются в Safari
У меня есть SVG-файл иконок, который выглядит следующим образом:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<path id="instagram" d="..."/>
<path id="linkedin" d="..."/>
<path id="twitter" d="..."/>
</svg>
И это упоминается в моем HTML, как это:
<a href="...">
<svg viewBox="0 0 32 32"><use xlink:href="icons.svg#instagram"></svg>
</a>
<a href="...">
<svg viewBox="0 0 32 32"><use xlink:href="icons.svg#linkedin"></svg>
</a>
<a href="...">
<svg viewBox="0 0 32 32"><use xlink:href="icons.svg#twitter"></svg>
</a>
И, как и многие вопросы до этого, SVG не рендерится в Safari ни на настольных компьютерах, ни на мобильных устройствах.
Есть ли способ сделать так, чтобы они отображались с <svg>
теги, которые работают во всех браузерах? Я хотел бы не редактировать CSS, который стилизует <svg>
теги, если это возможно. Это <object>
пометить единственное решение, которое работает во всех браузерах? Имеется в виду id
пути также действительны с <object>
тег?
Спасибо!