Question

这是html：

<div id="terms" class="terms">
        <center><a href="terms.html">Terms & Conditions</a>
</div>

CSS：

# terms {
width: 100%;
position: absolute;
bottom: 0;

}

.terms {
width: 100%;
position: relative;
bottom: 5px;
}

我做错了什么？我已经尝试了50种不同的html和css变体来让这些术语保持在页面的底部，但它在页面的中心浮动。它将从顶部到中间向右和向左，但我不能让它漂浮到页面的底部！整个页面设置为两个浮动列.right和.left

请帮助!!谢谢！

Answer 1

我为你设置了一个小提琴：

<强> http://jsfiddle.net/uh53X/1/

修改您的代码，如下所示：

<强> HTML

<div class="terms">
  <center><a href="terms.html">Terms & Conditions</a></center>
</div>

<强> CSS

div.terms{
    display:block;
    position:absolute;
    bottom:0;
    right:0;
    width:100%;
    background:#eee;
    border:1px solid #ddd;
}

希望这有帮助。

Answer 2

请参阅以下演示

CLICK HERE FOR DEMO

HTML

<div class="wrapper">
    <div id="terms">
        <center><a href="terms.html">Terms &amp; Conditions</a></center>
    </div>
</div>

<强> CSS

.wrapper{
    width:500px;
    height:500px;
}

#terms {
    position: fixed;
    bottom:5px;
    width: 100%;
    left:0px;
    height:25px;
}

根据评论更新：

CLICK FOR DEMO 2

HTML

<div class="wrapper">
    <div class="pageBox">
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
        <p>
        This is test page height will be managed accordingly and footer will be attached after this box.
        </p>
    </div>

    <div id="terms">
        <center><a href="terms.html">Terms &amp; Conditions</a></center>
    </div>
</div>

<强> CSS

.wrapper{
    width:500px;
}

.pageBox{
    height:auto;
}

#terms {
    width: 100%;
    height:25px;
}

Answer 3

您是否希望将页脚粘贴到页面底部，无论您拥有多少内容？ - sticky footer，当我想将我的页脚锚定到底部时，这就是我所使用的（虽然从你的示例页面看起来可能不是你所追求的）

或者您只是想确保它位于页面中最后一项的下方？为什么不在最后一项之前和条款

之前添加清算div / br

.clearboth {
    font-size: 1px;
    line-height: 0px;
    clear: both;
    height: 0px;
}

<br class="clearboth" />

然后，不管两侧的花车，你都可以让你的div作为常规项目坐在其下面

希望其中任何一个有帮助

需要版权才能保持在最低点

3 个答案: