Scale SVG to container without mask/crop

Question

I have tried many variants of the svg parameters, but have had no joy in scaling this particular SVG.

I am trying to contain this SVG into a container e

Answer 1

Set the SVG width and height to be the size of its container, and set preserveAspectRatio = none.

and

$("svg").each(function(){
  this.width = this.parentNode.width;
  this.height = this.parentNode.height;
}

That's it. Setting CSS is not needed.

I personally set viewBox to be the size of the contents of the SVG. So in my example, the original image I am loading into my SVG is 300x200. It will shrink to fit a 50x100 div. But viewBox manipulation is a separate issue.