Какова причина непонятного отступа внутри SVG-контейнера?

Question

[Алексей Николаев]

Доброго вечера.
Есть фиддл, который демонстрирует проблему. В первом случае (icon-1) я указал вьюбокс у элемента symbol в svg-спрайте, ограничив размеры контейнера с use. Все работает так, как надо, однако во втором случае (icon-2) я указал только один вьюбокс - у svg-контейнера с use.

Откуда пустое пространство во втором блоке, почему так происходит? Ведь вьюбокс корректен и покрывает ту же область, что и в первом случае.

Возможно, есть абзац в спецификации, который я не заметил?
Заранее спасибо.

Answer 1

[Антон Кирпач]

Я так понимаю вся проблема в viewBox
от сюда убрать <svg class="icon icon-2" width="100" height="100">
суда добавить <symbol id="icon-2" viewBox="2.5 3.5 35 35">

Comments

[Алексей Николаев]

Так и есть, но почему такое странное поведение( На том же csstricks рекомендуют наоборот делать, убирать из символа и писать в svg