svg background IE und Positionierung Problem

Question

Hallo Ich habe zwei Svg's, die ich verwenden, um ein Banner wie Bild in meinem Header zu erstellen. Einer sitzt links, der andere rechts. In IE sitzen sie nur in der Mitte, wie repariere ich das?

#header-left { 
    background-position: 10% -7%; 
    min-height: 250px; 
    background-size: inherit; 
    background-repeat: no-repeat; 
    background-image: url(/wp-content/uploads/2017/05/banner-left-side-02-02.svg); 
    max-height: 250px; 
} 

#header-right { 
    background-color: rgba(169, 48, 37, 0); 
    background-image: url(/wp-content/uploads/2017/05/banner-right-side-01.svg); 
    background-position: 100% 100%; 
    background-repeat: no-repeat; 
    min-height: 250px; 
} 

Wenn Sie das Problem sehen ..., möchte http://dronework.com.au/

Answer 1

Ist dies nahe, was Sie suchen?

#header-left { 
 
    background-image: url(http://dronework.com.au/wp-content/uploads/2017/05/banner-left-side-02-02.svg); 
 
    background-repeat: no-repeat; 
 
    background-color: silver; 
 
    width: 50%; 
 
    height: 100px; 
 
    float: left; 
 
} 
 

 
#header-right { 
 
    background-image: url(http://dronework.com.au/wp-content/uploads/2017/05/banner-right-side-01.svg); 
 
    background-repeat: no-repeat; 
 
    background-color: lightgray; 
 
    width: 50%; 
 
    height: 100px; 
 
    float: right; 
 
    background-position: right; 
 
}

<div id="header-left"></div> 
 
<div id="header-right"></div>