每天进步一点点 —— float浮动导致高度"塌陷"(20/10/28)

Hi晨Sir
感谢好室友带来的解决办法

由于float浮动效果，带来的高度"塌陷"让CSS很菜的我只能请出室友出马，修改前效果如下

修改前图片

修改前样式

html
<div class="detail ">
   <div class="file"></div>
</div>

css
外层样式
.detail {
  margin: 15px 10px 0px 10px;
  background-color: #FFFFFF;
  border-radius: 5px;
}
内层图片样式
.file{
  margin-left: 15px;
  margin-bottom: 10px;
  float: left;
}

修改后的效果如下

修改后图片

修改后样式

html
<div class="detail ">
   <div class="file"></div>
   <div class="clear"></div>
</div>

css
.clear {
  clear: both;
}

方法很简单，但是很管用，论有一个好室友的重要性