如何停止粘性页脚在内容DIV [英] How to Stop Sticky Footer at Content DIV

问题描述

我一直在调整我的粘性页脚，希望一旦它击中 #body div，就停止它，但到目前为止，我已经失败。在大多数情况下，它通常不会覆盖内容，但此页面上，通常会。

I've been tweaking my sticky footer in hopes of stopping it once it hits the #body div, but so far, I've been unsuccessful. In most cases, it doesn't usually cover the content, but on this page, it often does.

如果可能的话，我想保持它在窗口的底部，但是我能够想出的唯一其他解决方案是固定位置。任何建议？

I would like to keep it stuck to the bottom of the window, if possible, but the only other solution I've been able to come up with is a fixed position. Any suggestions?

推荐答案

好吧，你可以通过多种方式应用固定位置/粘性页脚。一个选项是仅使用CSS，如 Twitter Bootstraps Sticky Footer示例。这可能是最简单的实现。

Well, you can apply a fixed position/sticky footer in a number of ways. One option is using only CSS, as Twitter Bootstraps Sticky Footer example. That is probably the simplest implementation.

  /* The html and body elements cannot have any padding or margin. */
  html,body { height: 100%; }

  /* Wrapper for page content to push down footer */
  #wrap {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -100px; /* Negative indent footer by it's height */
  }

  /* Set the fixed height of the footer here */
  #push,#footer{ height:100px }
  #footer {}

这篇关于如何停止粘性页脚在内容DIV的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！