White Space Between SVG Background Repeats

If it's what I think it is, open up your SVG file and change the root <svg> element so that it includes the following attribute:

<svg ... preserveAspectRatio="none">

If it already has a preserveAspectRatio attribute, just change it to "none" and reload.


preserveAspectRatio="none" didn't work for me because it makes the svg to take the full width of its parent container.

Instead a take the parameters: preserveAspectRatio="xMinYMax meet" which in return I was able to use with background-repeat: repeat-x;

For more info here is an exellent article: A Look At preserveAspectRatio in SVG

Tags:

Html

Css

Svg