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">&nbsp;</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;}

blue div floating right issue http://www.imagesup.net/?di=7135585031013

这是在JSFiddle

来源

2012-12-18 Athapali

请发布一个完整的代码示例，包括HTML。 – j08691

请发布您的HTML。 –

要么你已经把蓝色容器中的绿色集装箱后，或你的利润，轮廓，边框和宽度的总和比外容器的宽度。 – Zeta

重新排列你的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">&nbsp;</div> 
<div class="content" style="min-height:250px; border:1px green solid"></div> 
</div>

jsFiddle example

您需要浮动侧边栏向右第一，否则将其置于持续不能前的一个元素，它也飘来以上浮了起来。

来源

2012-12-18 17:15:35 j08691

你没有代码，将允许蓝格冒泡绿色格旁边。

例如

.content { float: left; }

来源

2012-12-18 17:16:47 Quentin

浮动左下降只是它的黄色容器下方... – Athapali

@SarikaThapaliya - 它并不在这里：http://jsfiddle.net/aq2nj/ – Quentin

有道理现在谢谢！ – Athapali

回答

相关问题