1

我正在使用引导程序,并且在使用 Tab 插件时有一个页面给我带来了麻烦。标签正文被推到实际标签下方约 400 像素处。它只发生在这一页上,其他大多数页面都非常相似并使用相同的选项卡插件,但它们并没有引起太多问题。

标签代码:

  <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具有创建此类空白空间的类:after和样式存在问题。:before您可以将其添加到您的 CSS:

.nav {
  overflow:hidden;
}

查看演示http://jsfiddle.net/f2TG8/2/

于 2013-11-12T14:50:28.730 回答