Javascript 引导导航栏宽度/最大宽度

我的引导导航栏链接很多，所以它是包装的（我想是970px）-我不想包装，链接的宽度总共大约是1020px。我到处寻找答案：(

当我将1020px的宽度添加到

.navbar.navbar collapse

时，导航栏现在有点偏离中心-如何使其保持1020px的宽度并居中

 .navbar .navbar-collapse {
  text-align: center;
      width:1020px;
} 

那么，如何让导航栏不包裹，而是为平板电脑折叠

**编辑：这里是html-基本上（链接名称删除）

---

为什么是1020px而不是标准的1024px，您可以稍微减小字体大小，看看会发生什么。但是没有屏幕截图，我真的帮不了您多少忙。

您尝试过： 空白：nowrap；

---

另外，如果您将html/css减少到最小，但仍然存在问题并发布，其他人将能够检查并确认解决方案。

您能给我您的html代码吗？上面添加了。谢谢。好主意。现在，它的右边大约减少了25到30个像素。Nowrap是bizniz，它的右边仍然减少了大约20到30个像素。好奇。我n在这种情况下，我可以提出一种解决方案，但可以提出一种替代方案：因为您有许多菜单-将其中的一些菜单重新组织为一组或两组，并将它们放在下拉列表中。如果您将导航栏药丸/选项的数量减少到7个，则一切似乎都正常。请参阅[链接]
还有一个一般性的建议：不要设计一个需要1024像素的768px平板电脑世界。哈哈，谢谢：D艺术总监这样要求：）对于平板电脑，我认为图像可以减少%，导航栏会崩溃，你怎么看？我在尝试之前不会这么想。：-）对于你的艺术总监来说，试着折衷一下：如果屏幕比XXXX宽，使用完整菜单，否则：在下拉列表中放入一些内容。这就是媒体查询的目的。没有 也可能（）是另一个提问的好地方。酷，所以你从桥上跳下来，然后你想这是否是个好主意。好的建议和链接。谢谢D

<!-- NAVIGATION -->
<div class="container">
    <!-- Fixed navbar -->
    <nav class="navbar navbar-default navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>

        </div>
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li><a href="#welcome">LINK 1</a></li>
            <li><a href="#who">LINK 2</a></li>
            <li><a href="#benefits">BLAH BLAH</a></li>
            <li><a href="#outline">BLAH BLAH BLAH</a></li>
            <li><a href="#package">THE BLAH BLAH BLAH</a></li> 
            <li><a href="#faq">BLAH</a></li> 
            <li><a href="#testimonials">BLAH BLAH BLAH</a></li>
            <li><a href="#bonuses">BLAH</a></li> 
            <li><a href="#buy" class="buyNow">BLAH</a></li> 

          </ul>

        </div><!--/.nav-collapse -->
      </div>
    </nav>
<!-- End Fixed navbar -->
</div>

.navbar .navbar-nav {
  display: inline-block;
  float: none;
  vertical-align: top;
}

 .navbar .navbar-collapse {
  text-align: center;
      width:1024px;
      white-space: nowrap;
        border: 3px dotted #ff00ff;
}


/* navbar */
.navbar-default {
    background-color: #f2b32a;
    border-color: #C89321;

    font-size: 13px;
    letter-spacing: -0.9px;
}

/* link */
.navbar-default .navbar-nav > li > a {
    color: #fff;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #333;
}
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus {
    color: #555;
    background-color: #E7E7E7;
}
.navbar-default .navbar-nav > .open > a, 
.navbar-default .navbar-nav > .open > a:hover, 
.navbar-default .navbar-nav > .open > a:focus {
    color: #555;
    background-color: #D5D5D5;
}
.navbar {
 box-shadow: 1px 1px 3px #C89321; 
/*   visibility: hidden; */
}

.buyNow{

    font-size: 19px;
}