Jquery选项卡边框线以展开div部分内容

Question

这允许我在标签部分中并排显示两个div，但是标签周围的边框线不符合div中的内容。它没有正确扩展。谁知道如何解决这个问题？

ASPX

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Main</a></li>
        <li><a href="#tabs-2">Proin dolor</a></li>
        <li><a href="#tabs-3">Aenean lacinia</a></li>
    </ul>
    <div id="tabs-1">
        <div id="container">
            <div id="first">
                sdfd<br />
                sdfdf</div>
            <div id="second"></div>
         </div>
    </div>
    ...
</div>

CSS

#container
{
    width: 900px;
    background-color: #ffcc33;
    margin: auto;
}
#first
{
    width: 200px;
    float: left;
    /*height: 300px; */ /* take this out to work wit below solution*/
    background-color: blue;
}
#second
{
    width: 700px;
    float: left;
    height: 300px;
    background-color: green;
}
#clear
{
    clear: both;
}

Answer 1

使标签浮动

#tabs{
 float:left;
 width: 100%;
}