html - 以水平顺序而不是垂直顺序显示 css 列

Question

<分区>

Answer 1

尝试使用 float :

演示:http://jsfiddle.net/GCu2D/912/

HTML

<div id="columns">
    <div id="box1">box1</div>
    <div id="box2">box2</div>
    <div id="box3">box3</div>
    <div id="box4">box4</div>
    <div id="box5">box5</div>
    <div id="box6">box6</div>
</div>

CSS:

#columns {
    width:400px; /* change it according to your design*/
}
#columns div {
    float:left;
    width:50%;/*so as to give equal width to div */
    outline:1px solid red;/*optional*/
    height:400px;/*use your own value*/
}
#columns:after {
    content:"";
    display:block;
    clear:both;
}