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


有時候我們需要在一個div裡面讓兩個div浮動(如圖),但浮動後父元件的高度會整個不見~此篇stack overflow討論提供了多種解法。
擷取
Sol 1. 讓父元件也浮動
優: Semantic code.缺: 如果上層還有元件的話…?
Sol 2. 設定高度
缺: 彈性不足
Sol 3. 在最後加入一個元件,並清除浮動
擷取1
Sol 4. 在父元件加入”overflow: auto
Sol 5. 在父元件設定以下樣式:

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

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *