對於一些老網頁設計者用表格用習慣了，有些思路還是延續表格的思想，如果要使用Div CSS布局方式實現多個等高的Div那怎麼辦呢？辦法是有的，我們可以使用display:table, display:table-row and display:table-cell ，高度小的容器會自適應高度較高的的Div容器。我們先來看Div結構：
1
<div class="equal">
2
<div class="row">
3
<div class="one"></div>
4
<div class="two"></div>
5
<div class="three"></div>
6
</div>
7
</div>
上面的代碼看著像不像以前的<tr><td>結構呢？我覺得挺像。好，Div的結構搞定了，下面就用CSS去控制它：
1
equal{display:table;border-collapse:separate;}
2
.row {display:table-row;}
3
.row div {display:table-cell;}
4
.row .one {width:200px;}
5
.row .two {width:200px;}
6
.row .three {}
上面說一下上邊各個CSS屬性的意義：
1.dispaly:table;讓.equal層作為塊級元素的表格來顯示，也就是將顯示成表格的樣子
2.border-collapse:separate;邊框獨立，就像表格沒有合並單元格以前
3.display:table-row;將.row作為表格行tr顯示
4.display:table-cell;將.row的下級div作為表格單元格td顯示
使用border-spacing:10px;主要是來區分幾個盒子，因為IE下不能正常顯示，但是在：Mozilla、Opera、Firefox、Chrome下都是可以的。