IE上表格单元格内的空div百分比高度

Question

我想在表格的单元格之间创建某种垂直分隔符。我不能使用单元格边框，因为此分隔符的高度必须小于单元格的高度。

所以我添加了一个具有适当高度的空div的新单元格。

<div> <--- width/height auto
<table>
    <tr>
       <td>content 1-1</td>
       <td rowspan="2"><div class="separator"/></td>
       <td>content 1-2</td>
    </tr>
    <tr>
       <td>content 2-1</td>
       <td>content 2-2</td>
    </tr>
</table>
</div>

CSS

table, td {
   height:100%;
}

.separator{
   height: 80%;
   border: 3px solid black; 
}

在这里看到更完整的内容：http://jsfiddle.net/cCNP8/11/

所以除了IE之外，所有主要浏览器的这项工作都不令人惊讶 div的高度对他来说无关紧要，并显示6x6px的正方形。如果我将高度设置为桌子周围的div，但是我不想要它，它必须适合它的内容。

有什么想法吗？我完全可以做不同的事情。