What is the reason for the incomprehensible padding inside the SVG container?

Question

css

Good evening.
There is a fiddle that demonstrates the problem. In the first case (icon-1), I specified the viewbox at the symbol element in the svg sprite, limiting the size of the container with use. Everything works as it should, however in the second case (icon-2) I specified only one viewbox - the svg container with use.
Where does the empty space in the second block come from, why is this happening? After all, the viewbox is correct and covers the same area as in the first case.
Perhaps there is a paragraph in the spec that I didn't notice?
Thanks in advance.

Answer 1

As I understand it, the whole problem is in the viewBox
from here to remove <svg class="icon icon-2" width="100" height="100">
the courts to add<symbol id="icon-2" viewBox="2.5 3.5 35 35">