Html 引导导航正在塌陷到站点主体中

我有问题，我的导航崩溃到我的网站主体，我希望它保持固定时，浏览器窗口被重新调整大小。我已经尝试过调整bootstrapreresponse.css的最小/最大宽度，但它似乎仍然消失在正文中。任何帮助都将是惊人的。干杯我已将代码张贴在下面：

<div class="navbar" style="padding-bottom:0px;">
  <div class="navbar-fixed-top">
   <div class="container" style="width: auto;">
      <div id="logo"><a href="index.php"><img src="images/CoHlogo.jpg" class="logoImage";></a></div>
      <div class="nav-right"> 
        <!--Social Networking-->
        <a class="socialNav" href="mailto:info@classroomofhope.org?subject=Website Inquiry"><img src="img/social/mail.png"/></a>
        <a class="socialNav" href="http://www.youtube.com/user/Classroomofhope" target="_blank"><img src="img/social/youtube.png"/></a>
        <!-- Twitter
        <a class="socialNav" href="https://twitter.com" target="_blank"><img src="img/social/twitter.png"/></a> -->
        <a class="socialNav" href="https://facebook.com/ClassroomOfHope" target="_blank"><img src="img/social/facebook.png"/></a>
        <!--Google plus
        <a class="socialNav" href="https://google.com" target="_blank"><img src="img/social/googleplus.png"/></a> -->
        <!--Donate Button -->
        <a href="donate.php"><img src="img/donate_header.png" class="donateImage";></a> 
      </div>

      <div class="nav-collapse" id="nav-collapse">
        <ul class="nav" id="nav">
          <li class="dropdown" id="about"><a href="about_us.php"  class="dropdown-toggle" data-hover="dropdown">ABOUT US</a>


                <ul class="dropdown-menu">
                <li id="values"><a href="our_values.php">OUR VALUES</a></li>
                <li id="journey"><a href="our_journey.php">OUR JOURNEY SO FAR</a></li>
                <li id="founder"><a href="meet_the_founder.php">MEET THE FOUNDER</a></li>
                </ul>
          </li>
          <li id="education"><a href="why_education.php">WHY EDUCATION?</a></li>
          <li id="projects"><a href="projects.php">PROJECTS</a></li>
          <!--<li id="media"><a href="media_centre.php">MEDIA CENTER</a></li>-->
          <li id="donate"><a href="donate.php">DONATE</a></li>
          <li id="contact"><a href="contact_us.php">CONTACT US</a></li>
        </ul>



      </div>
    </div>
  </div>
</div>
</div>

从一个

元素中删除类

。导航折叠

解决了此问题。正如该类的名称所示，通过媒体查询接收

height:0

和

overflow:hidden

，具有该类的元素将隐藏在较小的屏幕尺寸上（我认为样式表所示的宽度是979px以下）

下面是一个（使用外部加载的引导CSS）演示了在没有此类的情况下如何显示布局。尝试调整结果窗格的大小，以查看它在不同屏幕大小下的外观

我希望这就是你想要的！如果没有，请告诉我，我很乐意进一步提供帮助

---

（编辑：）在查看您的实时环境时，我现在可以看到，当您说“塌陷”时，您的意思是导航链接断开到新行，因为父元素变得太小。这是浮动元件的标准行为。要阻止这种情况发生，您可以尝试将

最小宽度：1200px

或类似的内容应用于

.container

元素（位于

.navbar固定顶部的内部）。希望这有帮助
 非常感谢您的回复。我已经移除了，但是由于某种原因，我仍然得到了我不想要的塌陷。测试url为：以便更仔细地了解正在发生的事情。随着社交导航图标和“捐赠”按钮的调整，我正在努力保持中心导航位置。我希望他们与中心导航见面，并保持在“联系我们”的边缘，而不是像他们那样崩溃？？嗨，我已经编辑了我的回复，以便更好地解决这个问题，现在我已经看到了现场环境，尝试一下，看看它是否适合你。绝对精彩！非常感谢你的努力。当别人看到它时，它看起来很简单。干杯，伙计！伟大的我很高兴这帮了你的忙。哦，啊……如果这确实是正确的答案，你能接受吗？谢谢完成！！再次非常感谢！