Question

我正在尝试将div从页面顶部向下移动到底部，但它无效。

这是div及其CSS：

  <div class="slides">
    <?php include 'slides.php'; ?>
  </div>

.slides {
    width: 990px;
    height: 390px;
    margin-bottom: 15px;
}

我已经在jfiddle上获得了代码（其中一些）：

http://jsfiddle.net/jerU7/

您可以在此处查看原始页面：

http://www.autotrafficinfo.com/

我需要将顶部的旋转横幅向下移动到页脚正上方的底部。我将div（class =“slide”）向下移动到html的底部，但它仍然位于顶部。我意识到你可以让div做一些不明显的事情，但我不确定如何让这一点向下移动。

在jfiddle的代码中，您可以看到文本（“160万的实时流量......”）位于顶部。实际上，旋转图像朝向底部出现（虽然这三个都出现在那里，而不是一次出现并旋转，因为java脚本没有连接起来）。文字和横幅都应该在底部。

如何向下滑动div（class =“slide”），使其位于页脚上方？

Answer 1

的CSS：

  .slides{
      top:97%; // Or designate the px location if you so desire
      width: 990px;
      height: 390px;
      margin-bottom: 15px;
  }

Answer 2

您的代码需要进行一些重组。

将新#greenSmall div中的所有div从#green换行到.content。
从float:left

#green

将.slides div移至.content div下方footer div上方。

Answer 3

上面答案的代码几乎是正确的，但它错过了一个元素。对于＆＃39; top＆＃39;和＆＃39;底部＆＃39;要工作，元素必须绝对定位。所以，上面的代码将成为

.slides{
  position: absolute;      
  top:97%; // Or designate the px location if you so desire
  width: 990px;
  height: 390px;
  margin-bottom: 15px;

}

如何让div移动到页面底部

3 个答案: