Вы наверняка заметили, что изменение размеров SVG-элемента не влияет на его содержимое — потому что содержимое отрисовывается на бесконечном холсте, и непонятно какого размера область нужно растягивать или сжимать.

Это поведение можно изменить, задав размер области, которая будет тянуться, с помощью свойства viewBox (его можно задать только атрибутом):

<svg viewBox="0 0 237 300" width="350" height="200">
  …
</svg>

Первые два числа — координаты X и Y верхнего левого угла масштабируемой области, два других — её ширина и высота. Значения задаются в пикселях, единицы измерения указывать не нужно.

С вьюбоксом содержимое масштабируется, чтобы поместиться целиком в контейнер, и выравнивается по центру.