HTML/CSS将DIV对齐到页面底部和屏幕 - 以先到者为准

Ozz*_*zzy 18 html css dom position

我有一个div:

clear:both;
position:absolute;
bottom:0;
left:0;
background:red;
width:100%;
height:200px;
Run Code Online (Sandbox Code Playgroud)

还有一个html,正文:

html, body {
    height:100%;
    width:100%;
}


/* Body styles */
body {
    background:url(../images/background.png) top center no-repeat #101010;
    color:#ffffff;
}
Run Code Online (Sandbox Code Playgroud)

我的代码基本上是20个loren ipsum段落,然后是div.

现在我尝试将位置设置为相对和绝对等等但是绝对地将div对齐到屏幕的底部,所以当你向下滚动div scrols时

我尝试将其设置为相对但是当没有足够的内容使页面滚动时,div不在页面的底部.

我尝试修复,但只是修复它..对我没用

我怎样才能让div位于屏幕底部和页面,具体取决于是否滚动

Cra*_*ite 46

好的,修复和工作:D希望它做你想要的.在此预览:http://jsfiddle.net/URbCZ/2/

<html>
    <body style="padding:0;">
        <div style="position:fixed; width:100%; height:70px; background-color:yellow; padding:5px; bottom:0px; ">
            test content :D
        </div>
        <!--Content Here-->
    </div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)