margin的合并与float浮动的讨论

margin 合并现象：

1） 相邻的两个兄弟元素的外边距取两者之间的最大值进行合并（如上一元素的margin_bottom与下一元素的margin-top将会取一个最大值设为二者之间的间距）

2）清除浮动后，该元素的margin-top将会与上一浮动元素的padding+height+margin之和取最大值，成为该元素与浮动元素上一个兄弟元素（没有则为父级元素顶部）之间的距离

3）当某一元素为其父级元素的第一个或最后一个元素时（若其紧贴父级元素的上边或下边）会发生上或下边距合并。上边距合并：父元素与子元素之间不存在上边框、上内补、清除浮动属性之一（或将父级元素的overflow设为hidden也可。注：该方法不适用于body标签，除非将body标签与html标签同设为overflow：hidden），则会取二者margin-top最大值设为父级元素的margin-top；下边距合并：父级元素与子级元素之间没有border、padding以及父级元素没有多余的高度（及该子级元素占满父级元素剩余高度）或父级元素未使用overflow：hidden，则会发生下边距合并，与上边距合并现象相同，取二者之间最大值。

4）当某元素为空块元素，即该元素没有高度时，该元素的上下margin将会合并，取最大值。为其设置一个高度将会有效解决这种情况

  当一个元素设置为浮动时，因其脱离了文档流，其下一个兄弟元素若不设为浮动（或不清除浮动），则不能检测到该元素的存在，因而该兄弟元素的margin-top定位于该元素的上一个兄弟元素（若该元素为首个子元素，则定位于父元素顶部）。当该兄弟元素用clear清除浮动后，该兄弟元素的margin-top会与上层的浮动元素的padding-top+height+margin的值进行取最大值，相当于在未清除浮动时，将二者最大值设为该兄弟元素的margin-top

  某元素设置overflow：hidden后，将会清除其兄弟元素的浮动，并在紧贴其兄弟元素的一侧（如果其兄弟元素的float为left的话）（与将其设为浮动类似，但唯一不同的是，该元素并未浮动）

  而使用clear清除浮动则与overflow：hidden清除浮动不同，该方法则会另起一行，并不会与上一个浮动元素并列

  等同于（注意是等同于）若该元素的上一个兄弟元素的float为left，则overflow：hidden会将该元素的margin-left设为该兄弟元素所占空间的宽度，而margin-top会设为0,（即与该兄弟元素的顶部同处于一条水平线上）

  clear：left会将该元素的margin-left设为0（即对齐父元素），而margin-top将会被设为该兄弟元素所占空间的高度