内部有SVG元素的IE11表响应问题

时间:2017-04-05 15:36:04

标签: html css svg

嘿伙计我试图在帽子里面创建一个带有SVG元素的表格,如下所示

<table class="table">
  <tr>
    <td>Row 1</td>
    <td>Row 1</td>
    <td>Row 1</td>
    <td>Row 1</td>
  </tr>
  <tr>
    <td>Row 2</td>
    <td>Row 2</td>
    <td>Row 2</td>
    <td>Row 2</td>
  </tr>
  <tr class="arrow-row">
    <td>
      <svg version='1.1' class="svg-triangle" xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 35' enable-background='new 0 0 100 35' xml:space='preserve'>
        <polygon points='0,0 100,0 50,30' />
      </svg>
    </td>
    <td>
      <svg version='1.1' class="svg-triangle" xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 35' enable-background='new 0 0 100 35' xml:space='preserve'>
        <polygon points='0,0 100,0 50,30' />
      </svg>
    </td>
    <td>
      <svg version='1.1' class="svg-triangle" xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 35' enable-background='new 0 0 100 35' xml:space='preserve'>
        <polygon points='0,0 100,0 50,30' />
      </svg>
    </td>
    <td>
      <svg version='1.1' class="svg-triangle" xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 100 35' enable-background='new 0 0 100 35' xml:space='preserve'>
        <polygon points='0,0 100,0 50,30' />
      </svg>
    </td>
  </tr>
</table>

我的问题是它在Chrome上按预期工作

enter image description here

但是在IE11上它看起来像这样

enter image description here

这是测试https://jsfiddle.net/8eubhk6c/2/

的小提琴

任何帮助将不胜感激!谢谢。

0 个答案:

没有答案