引导选项卡在单击时移动

Bootstrap tabs move when clicked

本文关键字：单击 移动 选项      更新时间：2023-09-26

我的网站似乎遇到了一个奇怪的问题。当我在主页上，然后单击其中一个选项卡时，它会正常工作。一旦我尝试从其他选项卡之一单击到另一个选项卡(在我的示例中，从新闻到Beats，从Beats到新闻，从新闻到主页以及从Beats到主页(，选项卡的内容移动/移动一秒钟，然后切换。它从来没有这样做过，它似乎只是突然开始这样做。我只是想知道是否有其他人遇到过这个问题，或者是否有人知道解决方案。这是我网站的链接：

http://gscobeats.com/

澄清一下，我所说的是当您进入我的网站并让整个内容加载并单击其中一个选项卡时，页面会产生淡入淡出的过渡效果，然后出现您选择的页面。如果您单击从主页到任何选项卡，它可以正常工作。但是，如果您在其他选项卡之一上被选中并尝试单击其他选项卡，则页面会在过渡开始之前执行这种奇怪的缩小操作。我只是想知道是否有人知道如何解决这个问题

上合组织

问题似乎是在您的选项卡内容中，您正在使用没有容器.row或.row-fluid元素(这是 bootstrap 网格系统的重要组成部分(的span12元素，特别是您需要该容器，因为它为浮动span元素提供了清晰的修复，但如果您不想更改标记，您可以将其添加到您的 CSS 中：

.tab-pane:after {
    content: '';
    clear: both;
    display: table;
}

这是您要从活动项目中删除的边框。相反，将其颜色设置为透明。您还可以摆弄填充以适应行高变化。

.nav-tabs > .active > a {border: 1px solid transparent;}
相关文章：