如何将我的随机橙色盒子放在上面的橙色盒子下面？

Question

嗨，这可能吗？我已经尝试了所有需要将橙色盒子放在另一个橙色盒子下面的东西？这是我的代码，我疯了！

<div id="container"> 

    <div id="nav1"></div> 
    <div id="nav2"></div> 

    <div id="box3"></div> 
    <div id="box4"></div> 
    <div id="box5"></div> 
    <div id="box5"></div> 
    <div id="box3"></div> 

</div> 

CSS

#box3 
{ 
    width:250px; 
    height:200px; 
    background-color:#F30; float:left; 
} 
#box4 
{ 
    width:500px; 
    height:400px; 
    background-color:#F00; 
    float:left; 
} 
#box5 
{ 
    width:250px; 
    height:200px; 
    background-color:#C00; 
    float:left; 
} 

Jsfiddle

Answer 1

的jsfiddle：http://jsfiddle.net/W5uE3/

HTML：

<div id="container"> 

    <div id="nav1"></div> 
    <div id="nav2"></div> 

    <div id = 'cont1'>  
     <div class="box3"></div> 
     <div class="box3"></div> 
    </div> 
    <div id="box4"></div> 
    <div class="box5"></div> 
    <div class="box5"></div> 
</div>​​​​​​​​​​​​​​​​​ 

CSS：

#container { 
    width: 1000px; 
} 
.box3{ 
    width:250px; 
    height:200px; 
    background-color:#F30; 
    float:left; 
} 
#box4{ 
    width:500px; 
    height:400px; 
    background-color:#F00; 
    float:left; 
} 
.box5{ 
    width:250px; 
    height:200px; 
    background-color:#C00; 
    float:left; 
} 
#cont1 { 
    float: left; 
    width: 250px; 
} 

你并不需要使用的z-index，只是一个额外的容器。并将多个ID更改为类。

Answer 2

首先，你有2个格与box5 ID和2点div的id为box3，请考虑改变这些，你不能使用相同ID的DIV使用class而不是id。 然后

你应该使用clear:both你想放在底部其他的div。

例如：

<div id="box4" style="clear:both"></div> 
<div id="box3" style="clear:both"></div>