margin-bottom在safari浏览器失效的问题

今天遇到一个bug是底部明明有margin-bottom却无法作用，排查了一下改成用padding可以有效

但不找出原因是无法完成这篇博客的

问题概要描述：在safari中，当内容高度超出所有父容器时，内容的margin-bottom设置是无效的。

解决这个问题的办法也很简单，只要规避这种超出所有父容器的内容即可。父容器不设置高度即可。另外尽量少用html, body {height: 100%;}这种非常规代码。

最快捷就是改成padding