Search code examples
csssvgaspect-ratio

SVG with square viewBox overflowing viewPort

A have a non-squared svg and need a square (unit) viewBox that may be overflowing the viewPort. What can I do? I tried all options of preserveAspectRatio, which didn't work. Any other ideas would be much appreciated.

This is how it should be looking...

enter image description here

Solution

  • You want

    preserveAspectRatio="xMidYMid slice"

    slice ensures that the all the viewport is visible within the viewBox.