css - Div容器在另一个容器后面

Question

如果我调整浏览器窗口的大小，c3 会落后于 c2，我希望 c2 有一个“屏障”，这样 c3 就不会越过/落后于它。我尝试了很多事情都没有成功。

#c1 {

 float: middle;
 width: 100%;
 height: auto;
 margin: auto;
}

#c2 {

 float: left;
 width: 100px;
 height: auto;
 margin: auto;
}

#c3 {

background-color: blue;
float: middle;
width: 500px;
height: 100px;
margin: auto;

}

<div id="c1">
<div id="c2">
a
b
c    
</div>
<div id="c3"></div> 

Answer 1

尝试像这样将它们全部向左浮动..

#c1 {

float: left;
width: 100%;
height: auto;
position: relative;
}

#c2 {

 float: left;
 width: 100px;
 height: auto;
 position: relative;
 }

#c3 {

background-color: blue;
float: left;
width: 500px;
height: 100px;
position: relative;

}

<div id="c1">
</div>
<div id="c2">
a
b
c    
</div>
<div id="c3"></div>