html - CSS 列对齐

Question

我在对齐多栏页脚时遇到问题。这是我目前所拥有的。

http://jsfiddle.net/98xyG/

HTML:

<footer>
    <div id="aboutus"><h4>About Us</h4></div>
    <div id="contact"><h4>Contact Us</h4></div>
    <div id="location"><h4>Headquarters</h4></div>
</footer>

CSS:

footer {
    width:100%;
    height:250px;
    position:absolute;
    bottom:0;
    left:0;
    background:#ee5;
    clear:both;
}
footer  #aboutus{
    margin-left:10px;
    margin-right:73%;
    width:33%;
    height:1px;
}
footer #contact{
    margin-left: 35%;
    margin-right: 30%;
    height:1px;
}
footer #location{
    margin-left: 73%;
    height:1px;
}

Answer 1

添加

footer {overflow: hidden}
footer > div {float: left;}

工作 fiddle :http://jsfiddle.net/98xyG/1/