当单元格没有内容时，chrome中的表格会不断折叠？

Question

CSS

html,body{height:100%}
.mwh{width:100%;height:100%}
.w75c{width:75%}
.bor,.bor td,.bor th{border:1px teal dashed}

HTM

<table class="mwh bor">
    <tr>
        <td></td>
        <td>body</td>
        <td></td>
    </tr>
</table>

问题

当表格具有bor类时，第1个和第3个单元格显示相应的12.5％宽度，但当bor类被删除时，两个边单元格都会崩溃，除非它们的内容像{{{{}} 1}}。

有没有办法让它这样，因为这些侧面细胞不会崩溃？

Answer 1

添加

table-layout: fixed;

到表css。那么你不需要固定的宽度。

演示：http://jsfiddle.net/lotusgodkk/GCu2D/812/

CSS：

html, body {
    height:100%
}
.mwh {
    width:100%;
    height:100%;
    table-layout:fixed
}

Answer 2

添加

td {width:30%}

html,body{height:100%}
.mwh{width:100%;height:100%}
.w75c{width:75%}
.bor,.bor td,.bor th{border:1px teal dashed}
td {width:30%}

<table class="mwh bor">
    <tr>
        <td></td>
        <td>body</td>
        <td></td>
    </tr>
</table>