1

私は自分のページで Bootstrap nav-tabs を使用しています。次のようなものです。

<div class="container-fluid">

     <div class="row-fluid">
        <div class="span2">
        </div>
        <div class="span10">
            <!--Body content-->


<div class='row>
  <div class='span8'>
    <ul class="nav nav-tabs" id="myTab">
      <li class="active"><a href="#home">Home</a></li>
      <li><a href="#profile">Profile</a></li>
    </ul>

    <div class="tab-content">
      <div class="tab-pane active" id="home">...</div>
      <div class="tab-pane" id="profile">...</div>
    </div>

    <script>
      $(function () {
        $('#myTab a:last').tab('show');
      })
    </script>
  </div>
</div>


        </div>
     </div>
</div>

タブペインでグリッドを整理したいので、これを試しました：

<div class='row'>
    <div class='span4'>...</div>
    <div class='span4'>...</div>
</div

ペイン内ですが、それは機能しません。

ブートストラップを使用してタブペイン内に列をネストするにはどうすればよいですか?

4

1 に答える 1

0

これは私のために働きますhttp://jsfiddle.net/rKaaq/

<div class="row">
  <div class="span8">
    <ul class="nav nav-tabs" id="myTab">
      <li class="active"><a href="#home">Home</a></li>
      <li><a href="#profile">Profile</a></li>
    </ul>

    <div class="tab-content">
      <div class="tab-pane active" id="home"></div>
      <div class="tab-pane" id="profile">
      <div class="row">
        <div class="span4">This is some text that spans4</div>
        <div class="span4">This is some more text that spans 4</div>
       </div>  
      </div>
    </div>

    <script>
      $(function () {
        $('#myTab a:last').tab('show');
      })
    </script>
 </div>
</div>
于 2012-11-29T18:57:15.490 に答える