在html5 css3中创建类似页脚的多列

Question

我需要创建一个有三列的页脚.下面的代码给出了第二个图像而不是第一个图像;

<footer>
    <div id=”footer_links”> </div>
    <div id=”values”>.....</div>
    <div id=”contacts”>.....</div>
    <div id="copyright">.....</div>
</footer>

CSS代码:

footer{
 height: auto;
 padding:1px 15px 1px 20px;
 clear:both;
 }
#footer_links{
float:left;
}
#values{
 float:none;
 padding:0 600px 0 0;
 text-align:justify;
 }
#contacts{
float: right;

}

#copyright{
float:none;
text-align:center;
}

如何让我的div正确排列而不是像第二个例子那样被偏移？

Answer 1

您可以使用CSS3 Multicolumns.

div#multicolumns {
    -moz-column-count: 3;
    -moz-column-gap: 20px;
    -webkit-column-count: 3;
    -webkit-column-gap: 20px;
    column-count: 3;
    column-gap: 20px;
}

请参阅链接以获取预览和文档.