原理:父子巢狀元素在垂直方向的margin,父子元素是結合在一起的,他們兩個的margi會取其中最大的值。
正常情況下,父級元素應該相對瀏覽器進行定位,子級相對父級定位。
但由於margin的塌陷,父級相對瀏覽器定位.而子級沒有相對父級定位,子級相對父級,就像坍塌了一樣。
原理:兩個兄弟結構的元素在垂直方向上的margin是合併的
class
=>
class
="content"
>
div>
div>
class
="box1"
>
123span
>
class
="box2"
>
234span
>
class
="demo1"
>
1div
>
class
="demo2"
>
2div
>
.content
.box1
.box2
.demo1
.demo2
margin塌陷以 及 margin合併
3.乙個空元素,沒有border和padding 3.margin合併解決方法 總結 margin 合併就是,當兩個垂直margin相遇時,它們將形成乙個margin。合併的margin等於兩個發生合併的margin中的較大者。合併條件 注意 普通文件流中塊級元素 垂直margin 沒有border...
margin塌陷 margin合併的解決
父子巢狀元素垂直方向的 margin,父子元素是結合在一起的,他們兩個會取其中最大的值 正常情況應該是父級相對於瀏覽器進行定位,子級應該相對於父級定位的 但是 margin 塌陷是在父級相對於瀏覽器進行定位時,子級沒有相對於父級定位,就像父級的棚子沒有了一樣子級相對於父級,就像塌陷了一樣 a.給父元...
margin塌陷和margin合併問題及解決方案
父子巢狀元素在垂直方向的margin,父子元素是結合在一起的,他們兩個的margin會取其中最大的值.正常情況下,父級元素應該相對瀏覽器進行定位,子級相對父級定位.但由於margin的塌陷,父級相對瀏覽器定位.而子級沒有相對父級定位,子級相對父級,就像坍塌了一樣.margin塌陷解決方法1.給父級設...