我试图在相同高度的桌子上制作所有tds.我有四个细胞,每个细胞的宽度为25%.每个td将具有基于div的内容,该内容将是动态的并且长度不同.我无法改变它的结构.

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

小提琴链接:http://jsfiddle.net/binita07/kVm7P/1/

HTML

<div class="test">
    <table>
        <td><div>Dummy Content 1</div></td>
        <td><div>Dummy Content 2</div></td>
        <td><div>Dummy Content 1 and will be more</div></td>
        <td><div>Dummy Content 4</div></td>
    </table>
</div>

CSS

.test{
    width:400px;
    background:#f00;
}
table{
    border-collapse:collapse;
    padding:0;
}
table td{
    width:25%;
    display:table-cell;
    vertical-align:top;
    min-height:30px;
}
table td div{
    background:green;
    height:100%;
}