浮动和包装内容宽度

为什么如果我添加一个宽度到我的主要内容，它不再包装arount我浮动的div？浮动和包装内容宽度

<div style="float:left;width:30%;"> 
    content1 content1 content1 content1 content1 content1 content1 content1 
</div> 

<div id="mainContent" style="width:30%;"> 
     content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 
</div>

https://jsfiddle.net/ty9wuLeh/4/

来源

2016-10-04 epanu

如果'内容2'需要在'content1'附近“，则需要将第一个div放在第二个div中。 https://jsfiddle.net/ty9wuLeh/5/ – LinkinTED

对不起，我觉得我不够精确。我知道'content1'周围有'content 2''：我只需要在'mainContent'div中删除宽度。但我想知道它为什么这样工作的原因？计算显示的算法是什么？ – epanu

那么问题是什么.....................？ – LinkinTED

你飘来div应该被包含在你的mainContentdiv：

<div id="mainContent"> 
 
    <div style="float:left;width:30%;"> 
 
     content1 content1 content1 content1 content1 content1 content1 content1 
 
    </div> 
 
     content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 
 
     content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 
 
     content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 
 
     content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 content2 
 
    </div>

https://jsfiddle.net/ty9wuLeh/6/

来源

2016-10-04 12:04:41 Curt

浮动和包装内容宽度

回答

相关问题