情境:
标题高度+内容高度超出视口,其中隐藏了溢出的内容。内容绝对定位于顶部0,底部0,并且顶部边距等于标题高度,因此它不会与其重叠。
Opera缺陷:
在考虑元素的上边距之前,Opera似乎正在计算绝对定位的div(相对于视口)的高度。这适用于超出视口底边的内容(加标题),其中隐藏了溢出的内容(html{overflow:hidden}
)。
其他浏览器似乎在应用上边距后计算高度,这导致绝对定位div的整体更短的高度。虽然不是Opera,但是被遗忘的div与视口的大小相同,并且超出了视口的标题长度。
解决方法:
不要使用具有绝对定位的div的上边距,这些div延伸到隐藏视口溢出的视口之外。相反,将绝对位置div上的top
样式设置为上边距的长度
margin-top: 0px;
top: 68px;
这将使Opera和所有其他浏览器表现一致。