Question

我想将五个相等大小的div容器水平放置，彼此相邻。到目前为止，我明确地设定了位置和大小：

#container1{position:absolute; top:0px; margin:20px 0 0 5px; width:260px; height:90%; padding:0 10px;}
#container2{position:absolute; top:0px; margin:20px 0 0 270px; width:260px; height:90%; padding:0 10px;}
#container3{position:absolute; top:0px; margin:20px 0 0 535px; width:260px; height:90%; padding:0 10px;}
#container4{position:absolute; top:0px; margin:20px 0 0 800px; width:260px; height:90%; padding:0 10px;}
#container5{position:absolute; top:0px; margin:20px 0 0 1065px; width:260px; height:90%; padding:0 10px;}

但我希望不同屏幕尺寸的用户无需滚动即可查看整个网页。我可以将每个div的宽度设置为20％，但那我将如何定位它们？

非常感谢

Answer 1

您可以使用floating position，即http://jsfiddle.net/aK7Lv/

标记

<div class="floating">1</div>
<div class="floating">2</div>
<div class="floating">3</div>
<div class="floating">4</div>
<div class="floating">5</div>

的CSS：

.floating{
    float:left;
    width:20%;
    background:red;
    height:200px;
}

Answer 2

只需使用float属性。

#yourDiv
{
    margin:0;
    padding:0;
    width:20%;
    float:left;
}

水平适合5 div

2 个答案: