CSS页脚对齐问题

Question

我无法让这个页脚正确对齐并坐在底部 - 它应该是3列并且在页面上居中。有人可以帮忙吗？

/ * FOOTER * /

#footer {
line-height: 80px;
width:100%;
color: #fff;
height: 80px;
background-color: #111;
padding: 30px 0px 0px 0px;
}


/* column width */
#footer > ul > li {
width: 250px;
  list-style:none;
 float: left;
 border-left: 1px solid #fff;
 padding-left: 10px; 
  }

#footer > ul > li > ul {
    font-weight: normal;
      list-style:none;
       font-size: .80em;
 }

 #footer a, #footer a:visited, #footer a:active {
    color: #ffffff;
  }

  #footer a:hover {
    color: #ffffff;
  }



<div id="footer">
   <ul>
      <li>
         <ul>
             <li><a href="default.asp">About</a></li>
              <li><a href="default.asp">Contact</a></li>
             <li><a href="default.asp">Spare</a></li>
       </ul> </li>
     <li>
         <ul>
             <li><a href="default.asp">Terms</a></li>
            <li><a href="default.asp">Privacy</a></li>
           <li><a href="default.asp">Disclaimer</a></li>
        </ul> </li>
   <li>
        <ul>
    <li> or content on this website. Full disclaimer</li>   
        </ul>
</ul>

Answer 1

如果您希望元素与浏览器窗口齐平，则body元素的填充和边距必须为零。

Answer 2

如果它们浮出水面，我认为你不能将一组元素集中在一起。您是否考虑过将display:inline-block应用于列LI而不是float:left？

Answer 3

将#footer width属性设置为您想要的数量（自设置li宽度为250px以来750px min），然后将margin-left和margin-right设置为auto。这将使页脚居中。至于底部位置，您可以通过更改设置/更改#footer div的margin-top属性来调整它...我不明白“正确位于底部”意味着什么

Answer 4

简单，给每组的宽度约为32％，然后给页脚一个填充，这样左边的边缘就不会与边缘齐平。

#footer > ul > li {
width: 32%;
list-style:none;
float: left;
border-left: 1px solid #fff;
padding-left: 10px; 
}