Question

我正在努力将我的页脚扩展到页面底部，我接近了一些解决方案，但是它似乎无法正常工作。

我想要它，所以div bottomHalf扩展到浏览器页面的底部。但由于某种原因，它不断超越它。

我怎样才能让它发挥作用？我在身体包装中将高度设为100％bottomHalf

<style type="text/css">

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    background-color: #F0E4C9;
    font-family:"Times New Roman", Times, serif;
}

#wrapper {
    margin: 0 auto;
    width: 990px;
    position: relative;
    min-height: 100%;
    height: 100%;
}

#topHalf {
    margin: 0 auto;
    width: 990px;
    height: 435px;
    background-color:#960;
}


#navigation {
    margin: 0 auto;
    width: 990px;
    height: 55px;
    background-color:#0CF;
}

#bottomHalf {
    margin: 0 auto;
    width: 990px;
    min-height: 100%;
    height: 100%;
    background-color: #4d3c37;
    color: #FFF;
}

</style>

<div id="wrapper">
  <div id="topHalf"></div>


  <div id="navigation"></div>


  <div id="bottomHalf">EXTEND THIS TO BOTTOM OF PAGE, GOES TO FAR</div>

</div>

Answer 1

#bottomHalf {
margin: 0 auto;
width: 990px;
min-height: 100%;
height: 100%;
background-color: #4d3c37;
color: #FFF;
possition: fixed;
bottom: 0;
}

扩展页脚底部

1 个答案: