jQuery UI選項卡：如何將div：left屬性放入選項卡？

Question

我使用jQuery UI 1.8.16的標籤。 我想在第一個標籤中放置幾個​​div作爲列（使用float:left屬性）。

但我不能正確地做到這一點：看起來像標籤不希望以正確的方式使用浮動屬性（見文本下的圖像）。

有代碼：

<div id="tabs"> 
    <ul> 
     <li><a href="#tabs-1">First</a></li> 
     <li><a href="#tabs-2">Second</a></li> 
     <li><a href="#tabs-3">Third</a></li> 
    </ul> 
     <div id="tabs-1"> 
       <div style="border:1px solid red;float:left;"> 
        some text<br>some text<br>some text<br>some text<br>some text<br>some text<br>some text<br>some text<br> 
       </div> 
     </div> 
     <div id="tabs-2"></div> 
     <div id="tabs-3"></div> 

</div> 

如何解決呢？

謝謝！

Answer 1

你必須clear your floats爲了使容器來計算適當的高度：

<div id="tabs-1"> 
    <div style="border: 1px solid red; float: left;"> 
     some text<br>some text<br>some text<br>some text<br>some text<br>some text<br>some text<br>some text<br> 
    </div> 
    <div style="clear: both;"></div> 
</div> 

你可以看到在this fiddle結果。