子元素如何撑满父元素？

Question

一个ul没有设定高度，定义了块级元素，内部有浮动的几个不等高的li元素，如何让里面所有li都等于最高的那个li元素的高度？ul的高度刚好由最高的那个li元素撑满

Answer 1

清除浮动可撑开 ul 高度

<ul class="clearfix"></ul>

.clearfix:after{
    clear:both;
    display:block;
    overflow:hidden;
    height:0;
    content:'';
}

Answer 2

设置ul overflow：hidden试试

Answer 3

清除浮动即可，为求简便可根据需要给ul设置overflow:hidden或设置浮动。全面了解清除浮动可以看看这篇文章:https://www.cnblogs.com/lhb25... 讲得十分清晰。

Answer 4

ul {

overflow:hidden;

}
li {

float: left;
padding-bottom: 9999px;
margin-bottom: -9999px;

}

Answer 5

浮动会让父元素失去高度。
可以给父元素添加 overflow：auto 属性完成。
同时，如果要兼容。设置父元素 *zoom:1;

另外，除了父元素外，记得给下面的元素清除浮动。

Answer 6

ul{
    dispaly:flex;
    align-items:stretch;
}

flex容器高度默认由子元素高度撑开，align-items:stretch;使所有子元素等高对齐。