.list {
overflow: hidden;
padding: 20px 0 0 0;
margin-top: 40px;
.item{
box-shadow: 0px 0px 10px #bbb;
margin: 0 20px 20px 20px ;
width: 285px;
height: 270px;
float: left;
background: #fff;
border-radius: 6px;
}
}
当list里面有很多个item时,且item的位置在浮动,由于item的数量不同,浮动位置不一,如果子啊list中不使用: overflow: hidden;
就会出现如下情况:
会导致下面的分行错位,紧跟在item后面,而且我们发现list里面没有任何高度(只有padding),这是由于float的作用,因此加上 overflow: hidden;会使list中的元素同样占据空间。就会出现一下情况: