[CSS] 浮動元件的父元件高度

有時候我們需要在一個div裡面讓兩個div浮動(如圖)，但浮動後父元件的高度會整個不見~此篇stack overflow討論提供了多種解法。

Sol 1. 讓父元件也浮動
優: Semantic code.缺: 如果上層還有元件的話…?
Sol 2. 設定高度
缺: 彈性不足
Sol 3. 在最後加入一個元件，並清除浮動

Sol 4. 在父元件加入”overflow: auto”
Sol 5. 在父元件設定以下樣式：

.clearfix:after {
   content: " ";
   display: block;
   height: 0;
   clear: both;
}