Bootstrap 3.0加上列表更改宽度 [英] Bootstrap 3.0 affix with list changes width

问题描述

我正在迁移到bootstrap 3.0.0，我有一个附加的菜单左边的问题：一旦它固定（10px滚动后），其宽度改变。在这个小提示中，它变小了，在我的真实网站中它变得更宽，并扩展了实际内容。

I'm migrating to bootstrap 3.0.0 and I'm having issues with an affixed menu to the left: as soon as it becomes affixed (after 10px scroll), its width changes. In this fiddle it gets smaller, in my real site it gets wider and expands on the actual content.

它与bootstrap v2.3.2完美配合。检查后，看起来像列表项不能很好地与 .affix {position：fixed;} 出现。

It worked perfectly with bootstrap v2.3.2. After checking it looks like the list items don't play well with the .affix {position: fixed;} that appears.

任何想法？

解决方案：基于最新的评论，我终于添加了这个JS片段，它修正了它，而不必设置固定的宽度固定元素：

SOLUTION: based on the latest comments I have finally added this JS piece which fixes it nicely without having to set a fixed width to the affixed element:

$(function() {
    var $affixElement = $('div[data-spy="affix"]');
    $affixElement.width($affixElement.parent().width());
});

推荐答案

我有同样的问题， / p>

I had the same problem and fixed with this:

 $(window).resize(function () {
                $('#category-nav.affix').width($('#content').width());
            });

基本上在调整大小的事件中，我计算内容div的宽度，并将加元素的宽度设置为。

basically in an event of resize I calculate the content div's width and set the width of affixed element to that.

这篇关于Bootstrap 3.0加上列表更改宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！