为什么浮动div重叠下一个元素？

<div id="tabs"> 
     ertgertget 
    </div> 

    <div id="design"> 
     EHELLOW RODL 
    </div>

CSS：

#design{ 
    border: solid 10px black; 
} 

#tabs { 
    border: 1px solid red; 
    float: left; 
}

为什么第二个div不完全出现的浮动div的，对不对？

即时通讯不完全确定你想达到什么......这是怎么回事：http://jsfiddle.net/omegaiori/2NLK8/2/ – valerio0999

另一个很好的解决方案。但为什么这是必要的？ –

我不明白你需要什么男人:) – valerio0999

#design{ 
    border: solid 10px black; 
    overflow:auto; 
} 

#tabs { 
    border: 1px solid red; 
    float: left; 
}

2014-04-30 15:07:58 potashin

对不起，不是下面，在右边。 –

你确定你更新了吗？ –

好的。您的版本中不需要宽度。 –

尝试：

#design { 
    border: solid 10px black; 
    display:inline; 
} 

#tabs { 
    border: 1px solid red; 
    display:inline; 
}

2014-04-30 15:11:04 laaposto

就是这样。但是，为什么不用原版呢？ –

而且你不需要你的版本中的浮动。 –

因为浮动元素，以尽可能多的空间，因为它的内容，而默认的块元素将一整行。如果你想让你的第二个div对齐到右侧，请将它右移

2014-04-30 15:13:09 n1kkou

http://jsfiddle.net/2NLK8/3/如果我修正宽度，它仍然出现在浮动div下。所以它不需要整行。 –

浮动两个div的 – n1kkou

我会让自己熟悉“clearfix”。

它将“明确的”浮在这些类型的案件。这是该行业中一种非常常用的方法。

2014-04-30 15:37:26 jaminroe

回答