Javascript - ff 和 ie margin-top 问题

Question

我正在为我的公司制作一个网页，它在 safari 和 chrome 中运行良好..

我对页面的所有内容都有一个包装器，并且我有一个 javascript 来检测我的包装器是否小于 innerHeight，然后将页脚放在底部，但由于某种原因，它在 IE 中不起作用和“Produkter”链接下的 FF。它不会将页脚一直放在底部，就像在这种特殊情况下 javascript 检测到包装器大于 innerHeight 一样，但是在“Produkter”下，包装器肯定比 innerHeight 更小！ ...所有其他包装器小于 innerHeight 的地方都很好用，在 IE 和 FF 中也是如此。

.. 在 Safari 和 Chrome 中，一切正常..

我做错了什么？

编辑：忘记代码和链接xD

Javascript：

var screen_height = window.innerHeight;
var wrapper_height = document.getElementById("main-wrapper").offsetHeight;
if (wrapper_height > screen_height) {
document.getElementById("footer-wrapper").style.marginTop = 0;  
}
else {
var height_calc = screen_height - wrapper_height;
document.getElementById("footer-wrapper").style.marginTop = height_calc + "px";
}

链接：www.sipri.dk/siliva - 如果有人想看看。

Answer 1

看起来好像您在“Produkter”下的某些内容上有一个底部边距。非浮动元素的垂直边距是可折叠的，这会影响您在 place_footer() 中的上边距计算。

在#wrapper div 上放置一个 1 像素高的下边框应该可以防止该 DIV 内元素的下边距与 #footer-wrapper 上的上边距折叠。

另一种方法是定位 #footer-wrapper 相对位置，并使用 CSS 中的“top”属性而不是上边距。这也将防止任何与折叠边距有关的问题。