页面底部在 Safari 中被截断答案

【问题标题】：Bottom of page gets cut off in Safari页面底部在 Safari 中被截断
【发布时间】：2011-01-28 20:55:58
【问题描述】：

我不明白为什么这个页面：http://wohf.squarespace.com/newsletter/ 在 safari 的底部被截断，似乎在所有其他浏览器中都可以正常工作（据我目前发现）！！

我正在使用一些 jquery 和 css 作为侧边栏和匹配高度的内容，并使画布从上到下运行，而页脚始终位于页面的最底部。网站的其余部分一切正常（据我所知），问题仅在此时事通讯页面上且仅在 safari 中。

谁能看出问题所在？

这是我正在使用的 jQuery：

    //***************************************
    // Position Elements on Newsletter Page
    //***************************************
    // Clear previously specified heights
    $("#modulePage6177253, #modulePage6177253 #canvasWrapper, #modulePage6177253 #canvas").height('auto');

    $("#moduleContentWrapper6177535").insertBefore("#modulePage6177253 #pageBodyWrapper");
    $("#moduleContentWrapper6177544").appendTo("#modulePage6177253 #pageFooterWrapper");
    $("#modulePage6177253 #pageFooterWrapper").insertAfter("#modulePage6177253 #canvasWrapper");

    equalHeight($("#modulePage6177253 #sidebar1, #modulePage6177253 #content"));
    equalHeight($("#modulePage6177253, #modulePage6177253 #canvasWrapper, #modulePage6177253 #canvas"));

    $("#modulePage6177253 #canvasWrapper").css("margin-bottom", "-100px");

function equalHeight(group) {
   tallest = 0;
   group.each(function() {
      thisHeight = $(this).height();
      if(thisHeight > tallest) {
         tallest = thisHeight;
      }
   });
   group.height(tallest);
}

【问题讨论】：

对我来说没有被切断。
哦！伟大的！谢谢！只是为了跟进，左侧边栏底部文本中的最后一个单词应该是“家庭”，并且在最底部应该有一个蓝色背景页脚，其中包含基本页脚文本。在 Mac 上使用 Safari 4.0.3 时，它对我来说很重要。但我还没有在其他地方发现问题。

标签： jquery html css height

【解决方案1】：

对我来说它在 Firefox 中被切断了，但是看看你的 CSS 你有溢出：到处都是隐藏的样式。我会先删除那些。

【讨论】：

我刚刚浏览并删除了我能找到的所有内容，但对 Safari 浏览器没有帮助。你用的是什么版本的火狐？ mac还是pc？
好像我错过了一个 - 让我试着找到它。
好的溢出：隐藏也内置在使用的原始cms模板中，所以我不得不覆盖它，所以我添加了：#canvasWrapper，#canvas，#pageBodyWrapper，#pageBody，.verticalNavigationBar，# sidebar1Wrapper，#sidebar1，#sidebar1 .section，#contentWrapper，#content {溢出：可见！重要； } 不过好像也没太大帮助，一点点，还是有问题的。
我刚刚在我的电脑上安装了最新版本的 firefox 并且页面没有出现切断？但是，现在它似乎在 Chrome 中出现了问题，我上次测试时还好，在更改溢出之前。
似乎将溢出设置为隐藏页面效果更好。并且问题是由于某种原因 safari 4 不喜欢我的用于均衡元素高度的 jquery？

【解决方案2】：

window.navigator.platform === 'iPhone' ?真：假

然后在 div 的样式上尝试添加

paddingBottom:window.navigator.platform === 'iPhone' ? '15vh':'0vh' 到该元素的内联样式中。

对于 react.js 它看起来像

页面内容在这里

【讨论】：