为什么蓝色 div 不与绿色 div 相邻?
这是html。只有带边框的容器。
<div id="wrapper960" style="min-height:350px; border:1px red solid">
<div class="content-sidebar-l" style="min-height:250px; border:1px yellow solid"> </div>
<div class="content" style="min-height:250px; border:1px green solid"></div>
<div class="content-sidebar-r"style="min-height:250px; border:1px blue solid"></div>
</div>
这是中间有居中 div 的 CSS。
#wrapper960 {margin:0 auto; padding:0; width:960px;}
.content-sidebar-l {
float: left;
width:170px;
margin:0;
padding:0;}
.content {
margin:0 auto;
padding:1em 0 0 0;
width:610px;
background-color:#fff;}
.content-sidebar-r {
float: right;
width:160px;
margin:0;
padding:0;}
(来源:imagesup.net)
它在 JSFiddle 中
最佳答案
将您的 HTML 重新排序为:
<div id="wrapper960" style="min-height:350px; border:1px red solid">
<div class="content-sidebar-r"style="min-height:250px; border:1px black solid"></div>
<div class="content-sidebar-l" style="min-height:250px; border:1px yellow solid"> </div>
<div class="content" style="min-height:250px; border:1px green solid"></div>
</div>
您需要先将侧边栏向右浮动,否则如果将其放在最后,它就无法 float 到同样 float 的元素之上。
关于css - div不向右浮动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13938018/