html - 我怎样才能让这些 div 彼此相邻

Question

它看起来像什么：

我希望白色 div 低于灰色 div，这样绿色 div 就不会去任何地方..

这是我此刻的代码。

#top {

background-color:#504A4B;
border:1px solid black;
border-radius:5px;
width:500px;
height:200px;
margin-left:auto;
margin-right:auto;
position:relative;
}

#middle {
background-color:#D1D0CE;
width:100px;
height:500px;
margin-left:36.8%;
margin-right:auto;
border:1px solid black;
border-radius:5px;
position:static;
clear: both;
}

#left {
background-color:#25383C;
border:1px solid black;
border-radius:5px;
width:75px;
height:75px;
margin-left:auto;
margin-right:auto;
clear:both

Answer 1

制作绿色 div并用andposition:absolute定位它。这样您就可以独立于灰色和白色 div 来定位它。topleft

Answer 2

消除

clear:both;

并添加

float: left;

到#middle 和#left

那应该给你一个想法

jsfiddle 演示

或者

添加

position:absolute

到 div#left