twitter-bootstrap下拉列表分成多行，如何增加它的宽度呢？

Question

在我的页面中我使用标题中的下拉菜单，我的问题是当内容超过屏幕大小时，下拉列表会突破另一行，

但我喜欢把它放在一行，

我似乎找不到解决问题的方法，因为不是所有的都是相同的宽度而且我不想让它居中，所以我无法指定一个固定的左下角，只想让它跨越左边，

我目前的css：

header div.nav-dropdown-menu {
    position: fixed;
/*      left: 50%; */
    padding-top: 8px;
    color: #d6223b;
    background-color: rgba(240, 240, 240, 1);
    border-radius: 0 0 5px 5px;
    min-height: 200px;
    margin-top: -2px;
    border: .08em solid #BEBEBE;
}

你可以在这里试试http://www.bootply.com/6dcH6D9916

Answer 1

我能够在jQuery中编写一个简单的代码来实现这一点，但仍然试图弄清楚是否有一种css方式。

                        $("header .nav-dropdown-menu").each(function(index,elm){
                            elm = $(elm);
                            elm.css("right","inherit");
                            if((elm.offset().left+elm.width())>(window.outerWidth-15)){
                                elm.css("right","15px");
                            }else{
                                elm.css("right","inherit");
                            }
                        });