Cannot stretch svg background image, aspect ratio will be preserved

Question

I am using svg as background image and I want it to be stretched to 100% 100%.

However, it seems like both Chrome and firefox are doing their best to retain the aspect ratio of the svg and instead shrink it in the other width.

Normal size

div
{
    background: url(image.svg) no-repeat;
    background-size: 100% 100%;
    width: 14rem;
    height: 4rem;
}

Double width

div
{
    background: url(image.svg) no-repeat;
    background-size: 100% 100%;
    width: 28rem;
    height: 4rem;
}

Double height

div
{
    background: url(image.svg) no-repeat;
    background-size: 100% 100%;
    width: 14rem;
    height: 8rem;
}

How can I instead have that svg stretched?

svg contents:

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Lager_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 371.7 102.8" enable-background="new 0 0 371.7 102.8" xml:space="preserve">
<polygon fill="#EF9104" points="370.4,100.5 0,100.5 0,0 269.4,0 "/>
</svg>

Answer 1

You should add

<svg preserveAspectRatio="none">

to your SVG.

MDN Reference Link

<none>

Do not force uniform scaling. Scale the graphic content of the given element non-uniformly if necessary such that the element's bounding box exactly matches the viewport rectangle.

Answer 2

Appreciate that this is an old question but I was having issues with this so wanted to post some further information in case it helps anyone else...

<svg preserveAspectRatio="none"> this only works when a viewBox attr is provided, for instance: <svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1920 1152">

"preserveAspectRatio only applies when a value has been provided for viewBox on the same element. For these elements, if attribute viewBox is not provided, then preserveAspectRatio is ignored." https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/preserveAspectRatio

Hope this helps someone else!