本文共 425 字，大约阅读时间需要 1 分钟。

1. display:table-cell自适应布局

典型的双栏布局类名使用如下：

这种方式实现的自适应布局，元素宽度无需定值，且margin(浮动部分)与padding自由设置，支持百分比宽度（table-cell内），且可以无限制嵌套，兼容性不错，在我看来是最佳自适应布局方式

2. 美中不足及修复

人生不如意事八九，display:table-cell自适应布局虽然强大，但是，其有个比较烦人的克星，就是连续单词字符换行的问题。例如sbsbsbsbsbsbsbsbsbsb这样的连续字符。对于一般的元素，很好办的直接

而display:table-cell声明的作用就是让元素以td标签的形式呈现，因此，当他们遇见pre标签或td标签的时候就会出问题。。

对于pre标签

就可以安心回家过年年了

对于td类标签

其中width属性是必须的，但是width值大小您可以根据实际情况进行设置。个人认为100%基本上就可以受用于所有情况，无需另作修改