嵌套div的margin-top不生效

之前遇到过嵌套div设置margin-top不生效的情况，一直没去研究，今天又遇到了，查阅资料得知原因，并不是margin-top没生效，只是当外层容器跟内层容器之间没有别的元素的时候，内层容器的margin-top会作用在外层容器上。

解决办法如下：

1、在父层div加上：overflow:hidden。

2、把margin-top外边距改成padding-top内边距。

3、父元素产生边距重叠的边有不为 0 的 padding 或宽度不为 0 且 style 不为 none 的 border。

4、让父元素生成一个BFC：

•  float: left/right
•  position: absolute/fixed
•  display: inline-block/table-cell(或其他 table 类型)
•  overflow: hidden/auto
•  父层div加：position: absolute;