Because in the first one you aren’t using a viewbox
.
See – http://tutorials.jenkov.com/svg/svg-viewport-view-box.html
https://codepen.io/Paulie-D/pen/xXxerd
The viewBox attribute allows you to specify that a given set of graphics stretch to fit a particular container element.
The value of the viewBox attribute is a list of four numbers min-x, min-y, width and height, separated by whitespace and/or a comma, which specify a rectangle in user space which should be mapped to the bounds of the viewport established by the given element, taking into account attribute preserveAspectRatio.