I've SVG with a background image like :
<svg preserveAspectRatio="xMidYMin" viewBox="0 -505 500 505" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
<image xlink:href="style/image/svg/background.jpg" x="0" width="489.72" y="-501.813" height="501.813"/>
<g id="limits">
<path class="limits_1" d='M 435.93263055394345 -85.347777874162432 L 439.53269849462669 -78.780584897426891 438.66214876086451 -74.05024425651645 435.83861350815863 -72.351379868481317 437.4283067958022 -70.182109196687819 435.8171570844774 ... Z'/>
</g>
</svg>
I call him in web page :
<link rel="stylesheet" type="text/css" href="style/css/svg_index.css" media="all"/>
<div id="global">
<div id = "map">
<?php
include( "data/svg/mysvg.svg" );
?>
</div>
</div>
And I manage style with this CSS :
#global {
width:100%;
min-height: 555px;
position:relative;
overflow:hidden;
height: 100%;
}
#map{
width:100%;
height:100%;
margin-left: auto;
margin-right: auto;
float: right;
}
#map > svg {
width:100%;
height: 96%;
margin-left: auto;
margin-right: auto;
}
.limits_1 {
fill: rgba(0,0,0,0);
stroke: white;
stroke-width: 1;
}
When I want to see the result on many on IE 10 or IE Edge, all it's ok I've this result :
But when I try the emulation on IE 9 I've this !
My picture is the same but she's reduce.
I founded this subject on StackOverflow, but in my case, I can't write my svg in imb balise because I've Javascript interaction with it.
Thank you.
