margin-top作用到父元素上边的问题

问题：当两个容器嵌套时,如果外层容器和内层容器之间没有别的元素,firefox会把内层元素的margin-top作用到父元素上边。

在做项目时遇到了这个问题，百度了一下应该是值传递的问题
解决：（通过触发BFC也可以解决）
1、在父级中添加border
例如：border:1px solid #00FFFF;
2、在父级中添加padding
例如：padding:1px;
3、推荐使用。
例如：overflow: hidden;

原因：父元素的第一个子元素的上边距margin-top如果碰不到有效的border或者padding或者非空内容（如一段文字），就会一层一层地合并父元素的margin-top成一个单独的margin-top。因此只要给父元素设置个有效的 border或者padding或在子元素前增加一段非空内容（如文字）就可以阻止它去合并父元素的外边距了。