Stretch svg background without keeping aspect ratio

Question

I want to use an svg image as background-image, I want to show the entire image (no crop) and stretch the image to 100% height and width of the container div without

Answer 1

.sample {
   height:500px;
   width:500px;
   background-image: url('sample.svg');
   background-size:cover;
   background-position:center center;
}


<div class="sample"></div>

Just try it. I hope this will help you

Answer 2

Use

height:100% ;width:100%; background-size:contain; 

to keep background aspect ratio.

Answer 3

Solution:

Open the svg file in a text editor and add this attribute:

<svg preserveAspectRatio="none"