1、在最后一個子元素后面清除浮動 2、父元素加over-flow:hidden;(副作用：子元素定位不能超出父元素的范圍) 3、父元素也一樣浮動(最笨的方法)； 4、子元素使用inline-block;代替浮動； ...

一、問題描述： 　　當使用Flex布局時，子元素設置百分比高度后，如下圖沒有效果： 二、解決方法： 　　父元素必須設置高度，效果如下圖： 三、完整代碼如下 View Code ...

浮動元素使其父元素高度塌陷 我們經常會遇到一種情況，給一個元素設置浮動之后 float:left/right;，如果該元素的父元素有背景顏色，那么會發現父元素的背景顏色消失了；如果父元素有一個邊框，那么浮動元素無法將邊框撐開。 這就要回到浮動元素的特性來說明此問題“當元素設置浮動后，會自動脫離 ...

當對盒子內的子元素應用float后，導致對象父元素內有高度，不能被撐開自使用高度。這是因為對子元素使用float之后，脫離了正常流，使得父元素沒有高度導致的。 解決辦法： 1.為父元素設置高度：適用於知道父級高度的情況，缺點是父級元素不能自適應 2.使用clear:both清除浮動：這里注意 ...

如果子元素沒有設置浮動(float)，父元素實際上會根據內容，自動寬高進行適應的。 當子元素增加了浮動后，最簡單的處理方法是給父元素添加overflow:hidden屬性，此時父元素的高度會隨子元素的內容自動適應的。 亦或者在子元素的最后一個清楚浮動。 ...

正常情況 如果子元素沒有設置浮動（float），父元素的高度會隨着子元素高度的改變而改變的。 設置浮動以后 父元素的高度不會隨着子元素的高度而變化。 例如：在一個ul中定義若干個li，並設置float='left' 顯示結果就會是這樣： 解決辦法 最簡單的方法是，給父元素 ...

問題展示：可以看到設置float:left的盒子沒有高度，導致下面的盒子錯亂，往上移了。 正確展示： 第一種方法：只需要在float浮動盒子的父級元素加上 overflow: hidden 就可以！ 第二種解決辦法：在浮動div的后面加上這個就可以 ...

情景描述：父元素由一個設置了高度的元素撐起，另一個元素自動繼承父元素的高，並且兩元素在一行顯示。 現在情況 方法1： 　　設置父元素flex，子元素不設置高度 方法2： 　　父元素相當定位，子元素絕對定位，設置100%高 s1和s2元素都要 ...