1

ブートストラップを使用していますが、タブ プラグインを使用すると問題が発生するページがあります。タブの本体は、実際のタブの下に約 400px 押し下げられています。この 1 つのページでのみ発生しています。他のほとんどのページは非常に似ており、同じタブ プラグインを使用していますが、それほど問題は発生していません。

タブコード:

  <ul class="nav nav-tabs">
    <li class="active"><a href="#entireAsset" data-toggle="tab">Entire Asset</a></li>
    <li><a href="#entireSite" data-toggle="tab">Entire Site</a></li>
    <li><a href="#singleService" data-toggle="tab">Single Service</a></li>
  </ul>

  <!-- Tab panes -->
<div class="tab-content">
  <div class="tab-pane active" id="entireAsset">
    <p>Hello tab 1</p>
  </div><!--End Entire Asset tab-->
  <div class="tab-pane" id="entireSite">
    <p>Hello tab 2</p>
  </div>
  <div class="tab-pane" id="singleService">
    <p>Hello tab 3</p>
  </div>
</div>

jsFiddle: http://jsfiddle.net/f2TG8/

私の CSS とすべてのリソースは JSFiddle にあります。

4

1 に答える 1

2

このような空白を作成するクラスとスタイル.navには問題があります。これをcssに追加できます：:after:before

.nav {
  overflow:hidden;
}

デモを見るhttp://jsfiddle.net/f2TG8/2/

于 2013-11-12T14:50:28.730 に答える