我有一个内联SVG图形，其中包含我想要保留的宽高比。我将它显示为身体标签的100％，这是它的父标签。图像的宽高比为10：3。
svg{width:100%;margin:0;padding:0;overflow:hidden;display:block;background:#0f0}
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 300">
<path d="m1.25e-5 0v300h1e3v-300zm500 71.449 68.031 39.277v78.557l-68.031 39.279-68.031-39.279v-78.557z" fill="#f00"/>
</svg>
Chrome可使图像成为正文的宽度，并使图像具有合适的高度。例如，如果宽度为688px，则高度为206.39px。
Internet Explorer的宽度为688px，高度为150px。虽然它保留了红色物体的纵横比，但当背景渗透时，它会在侧面给我绿色条纹。
我尝试了各种Stack Overflow解决方案，例如{max-width:100%;height:auto}，但我找不到任何有效的方法。