Twitter bootstrap 3:当粘贴火焰时,Navbar会改变宽度

Question

好吧,我有一个关于bootstrap-3词缀脚本的好奇问题.你可以在这个小提琴中看到问题.请水平最大化结果框架并向下滚动以便粘贴被激活.如您所见,导航栏在右侧增加,我真的看不出任何这种效果的原因.我暂时通过addng解决了这个问题

 .container
{
padding-left: 0px;
padding-right: 0px;
}

到了css.但是,正如你所看到的,它不是很漂亮,我不想删除这些填充.或者,我可以设置静态宽度,如

width: 1140px;

在#nav.affix中.但这不是很敏感...我真的尝试了很多方法,但无法获得任何令人满意的结果.你知道吗,是什么原因造成的？

编辑

好的,Chrome的调试器给了我更多的信息:在激活词缀之前,nav-element得到了类'affix-top'等等(从chrome-debugger NOT html源代码摘要!):

<nav id="nav" class="navbar navbar-default affix-top" role="navigation" data-spy="affix" data-offset-top="133" style="background-color: yellow">

奇怪的是,在HTML代码中没有声明affix-top.不过,#nav.nav.navbar.navbar-default-affix-top的大小如下:1140px x 52px.

滚动和词缀激活后,类'affix-top'变为'affix','affix'的大小如下:1170px x 52px.

这些是30px,导航栏向右增长.但是我怎么能阻止它呢？最重要的是,我找不到任何csv文件中的类词缀顶...

Answer 1

你无法解决这个问题.问题是position: fixed;.浏览器将在没有left或right属性的情况下呈现Navbar .

您只能通过三件事来解决问题:

1.使用绝对定位.

使用jQuery滚动时使用position: absolute;和更改top值.缺点:你需要一个Javascript部分.

2.左/右

设置一个left: ?px;或right: ?px

3.定义一个特殊的宽度

为每个媒体查询设置min-width: ?px;和/或max-width: ?px;