twitter-bootstrap - Bootstrap2 タブ ナビゲーション: タブ コンテンツ div の位置

Question

ID="test1" の DIV が左タブ ナビゲーションと重複する理由を誤解していますが、class="tab-content" の div は重複しません。

これは私の例です

<div style="height: 160px;overflow: hidden;">
<div class="tabbable tabs-left" >

    <ul class="nav nav-tabs">
        <li class="active"> 
            <a href="#tab1" data-toggle="tab">tab1</a>
        </li>

    </ul>
    <div id="test1">
<div class="tab-content" >
    <div id="tab1" class="tab-pane active"> Content tab1 </div>
</div>
    </div>
</div>

Answer 1

tab-content には css プロパティがありますoverflow: auto。タブはfloat: leftで、次の要素がoverflow: autodiv の場合、フローティングしている要素が残した幅に自動的に固定されます。通常、2 つの列に分割するために使用されます。

この 2 つの例を使用すると、次のことが明確になります。

とoverflow: auto: http://jsfiddle.net/eugip9/tVLgj/

<div>
  <div class="a" style="width: 20%; float: left;">Whatever</div>
  <div class="b" style="overflow: auto">A very long text ... </div>   
</div>

なしoverflow: auto: http://jsfiddle.net/eugip9/HVPhD/

<div>
  <div class="a" style="width: 20%; float: left;">Whatever</div>
  <div class="b">A very long text ... </div>   
</div>