IEでSVGが表示されないことってないですか？
あれってすごくなぞだったんですが、やっと解決しました。

原因

SVGにwidthとheightが入ってない

対策

SVGタグにwidthとheightを追加する

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 99 63">
  <defs>
    <style>
      .cls-1 {
        fill: #55c78f;
        fill-rule: evenodd;
      }
    </style>
  </defs>
  <path id="arrow_down" class="cls-1" d="M85.808,0.186L99.813,14.114,50,63.767,0.233,14.114,14.146,0.186,50,35.959Z" transform="translate(-0.219 -0.188)"/>
</svg>

これを

<svg xmlns="http://www.w3.org/2000/svg" width="99" height="63" viewBox="0 0 99 63">
  <defs>
    <style>
      .cls-1 {
        fill: #55c78f;
        fill-rule: evenodd;
      }
    </style>
  </defs>
  <path id="arrow_down" class="cls-1" d="M85.808,0.186L99.813,14.114,50,63.767,0.233,14.114,14.146,0.186,50,35.959Z" transform="translate(-0.219 -0.188)"/>
</svg>

このようにwidth=”“とheight=”“をつけてやればいいそうです。たまに、

<svg version="1.1" id="_x32_" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" style="width: 256px; height: 256px; opacity: 1;" xml:space="preserve">
<style type="text/css">
    .st0{fill:#fffff;}
</style>
<g>
    <polygon class="st0" points="163.916,0 92.084,71.822 276.258,255.996 92.084,440.178 163.916,512 419.916,255.996" style="fill: rgb(255, 255, 255);"></polygon>
</g>
</svg>

みたいにstyleではいってるやんってやつもありますが、ちゃんとwidth、heightでしてあげなければならないようです。

これは余談ですが、widthとheightが入ってるのでIEではCSSでwidth指定でサイズを変えた場合は　heightも指定してあげないと歪んで表示されるようですので、気をつけてください。

よいSVGライフを！