开发者社区 问答 正文

关于css3三列等高问题

有三个div,left、center、right,使他们三列等高
screenshot
让三个div的margin-bottom: -10000px;padding-bottom: 10000px;怎么理解

展开
收起
杨冬芳 2016-06-06 10:18:44 1763 分享 版权
1 条回答
写回答
取消 提交回答
  • IT从业

    这种方法叫做:padding补偿法,也是能够更好的兼容的方法。

    首先把列的padding-bottom设为一个足够大的值,再把列的margin-bottom设一个与前面的padding-bottom的正值相抵消的负值,父容器设置超出隐藏,这样子父容器的高度就还是它里面的列没有设定padding-bottom时的高度,当它里面的任一列高度增加了,则父容器的高度被撑到它里面最高那列的高度,其他比这列矮的列则会用它们的padding-bottom来补偿这部分高度差。因为背景是可以用在padding占用的空间里的,而且边框也是跟随padding变化的,所以就成功的完成了一个障眼法。

    来自:CSS布局奇淫技巧之-多列等高

    2019-07-17 19:27:48
    赞同 展开评论
问答标签:
问答地址: