SVG span внутри ссылки не работает в IE

Question

Необходимо добавить <span> между <a> и SVG, чтобы JavaScript мог вызывать SVG-строку из другого файла.Все работает, но не в IE, я что-то пропустил?(при тестировании в IE он даже не знал, что это ссылка, ничего не активируется, и у меня также есть эффект наведения, но в IE ничего не отображается.) Составление окончательного примера кода после того, как javascript загрузил встроенный SVGвсе вместе.

.icon svg{
  display: inline-block;
  width: 3rem;
  height: 3rem;
  margin: 0;
  stroke-width: 1.5;
  stroke-linecap: round;
}

.icon-black svg{
 stroke: #1A1A1A;
 }

<a href="#">
<span class="icon icon-black" id="icon-arrow">
<svg id="icon-arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke-linejoin="arcs"><path d="M12 19V6M5 12l7-7 7 7"/>
</svg>
</span>
</a>

Answer 1

Только что заметил, я пропустил установку <span> в качестве дисплея: inline-block;