html - SVG 在表格内占据全高 td

Question

如何让 SVG 占据表格单元格内的整个高度？

目标是通过仅更改单元格 () 内的代码而不对以像素为单位的高度进行硬编码来实现此目的。它在 firefox 和 safari 中工作，但在 IE 和 chrome 中它很奇怪(在 chrome 中没有大小，在 IE 中很大)

- fiddle中的例子(你看不到箭头)

Answer 1

设置max-height:100%在你的 <svg>是 Chrome 的已知解决方法。

参见:http://jsfiddle.net/DyUGN/7/

同时添加 display: block进一步改进渲染。

SVG {
    display: block;
    max-height: 100%;
}

参见:http://jsfiddle.net/DyUGN/8/

不过我不确定 IE 到底在做什么。我不知道解决方法。您可能必须使用 Phrogz 的方法。或者，如果您可以接受，只需设置 <svg> width和 height明确地:

<svg version="1.1" width="18" height="18" ...

参见:http://jsfiddle.net/DyUGN/9/