CSS tips! Layout div_html/css_WEB-ITnose like a table

下面是我翻译的内容，是根据我对文章的理解意译的，你就别挑哪里翻译的不对了，我的目的只是传达这个CSS技巧

　　许多网页设计师都喜欢，将两个或者多个容器等高的并排放置，并在里面展示每个容器的内容，就象经典表格布局中的单元格控制几个栏目的位置，也喜欢容器的内容居中或顶部对齐显示。
　　但是你又不喜欢用table来实现他，那怎么办呢？实现的方法很多，有根据视觉错觉实现的，有用JS控制使高度相等的，还有采用容器溢出部分隐藏和列的负底边界和正的内补丁相结合的方法来解决列高度相同的问题。
　　其实有个简单的方法，使用display:table, display:table-row and display:table-cell 就可以实现，而且高度小的容器会自适应那些高度相对较高的，但是IE不支持这个属性，我们先不用去责备IE，相信以后会有所改善的。这里我制作了一个模型。　

　　先看看xhtml的结构：

　　很简单不用解释就能看懂，但是这里给出一个table的结构，是不是很相似

　　下来是css：

.equal {
  display:table;
  border-collapse:separate;
}
.row {
  display:table-row;
}
.row div {
  display:table-cell;
}
.row .one {
width:200px;
}
.row .two {
width:200px;
}
.row .three {

}

　　解释：

　　1.dispaly:table;让层.equal作为块级元素的表格table显示，也就是将他作为一个表格
　　2.border-collapse:separate;边框独立，就像表格没有合并单元格以前
　　3.display:table-row;将.row作为表格行tr显示
　　4.display:table-cell;将.row的下级div作为表格单元格td显示
　　5.然后定义宽度

　　这里还使用了 border-spacing:10px;来区别几个盒子，正如上面所陈述的，IE下不能正常显示，但是在：Mozilla 1.6, Opera 7.50, Safari 1.2.2, Firefox 0.8, OmniWeb 5b, Camino 0.8b, and Netscape 7.1经过测试均可以完美显示.

　　上面的问题就是，这个模型对IE来说等同于垃圾，所以基本只能是做来玩玩而已，没有什么实际的用处，现在我要做的就是，让它也能在IE下更好的显示,所以我又做了第二个模型

　　xhtml结构类似第一个模型 的只是增加一个新的div给IE

Add a judgment to xhtml to judge whether it is IE, and then give IE a special treatment. IE displays different codes from other browsers. For this judgment, IEMAC gives priority to displaying the content.

Then add a judgment in CSS, cooperate with xhtml, and use floating alignment (floating alignment does not need to be explained) to achieve equal height side-by-side placement of containers, but it is still impossible to truly achieve equal height. You You can use the visual illusion of adding background color to achieve visual equal height, or use other methods, which will not be explained here.

The following is the code in CSS

At this point, the entire design is truly completed. Although it is not perfect, making efforts for non-IE is a bit redundant. Now either IE supports the first model, or we may come up with a better solution. But the attempt was worthwhile.