Question

好的，我已经查看了整个css，似乎无法弄清楚我的导航栏上顶级链接之间的宽度是什么。我需要让它们只是稍微小一些，所以当它调整为900px的子屏幕时，它不会将它变成2行导航栏而不是通常的1行。

我试过像navbar＆gt;李但没有成功让他们搬家。但无济于事，所以我要求

谢谢你这里是我的导航栏代码

<div class="navbar-wrapper">
      <!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
      <div class="container">

        <div class="navbar navbar-inverse">
          <div class="navbar-inner">
            <!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. -->
            <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button>
            <a class="brand" href="index.html">PC3</a>
            <!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
            <div class="nav-collapse collapse">
              <ul class="nav">

                 <li class="dropdown">
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">About Us <b class="icon-chevron-down icon-white"></b></a>
                  <ul class="dropdown-menu">
                    <li><a href="services.html">Services</a></li>
                    <li><a href="core.html">Core values</a></li>
                    <li><a href="staff.html">Staff</a></li>
                    <li><a href="know.html">How To Know God</a></li>
                 <li><a href="vol.html">Volunteering</a></li>

                 <li><a href="giving.html">Giving</a></li>
                    <li><a href="contact.html">Directions & Contact</a></li>
                  </ul>
                </li>
                 <li class="dropdown">
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Adult Ministries<b class="icon-chevron-down icon-white"></b></a>
                  <ul class="dropdown-menu">
                    <li><a href="adtov.html">Overview</a></li>
                    <li><a href="adtov.html#pst">Personal Spiritual Trainer</a></li>
                    <li><a href="adtov.html#care">Care Team</a></li>
                    <li><a href="adtov.html#hosp">Hospitality team</a></li>
                    <li><a href="adtov.html#int">Intercessory Prayer</a></li>
                    <li><a href="adtov.html#womens">Women's Ministry</a></li>
                    <li><a href="amp.html">Amplified Worship</a></li>
                    <li><a href="sermons.html">Sermons</a></li>
                  </ul>
                </li>
                 <li class="dropdown">
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Student Ministries<b class="icon-chevron-down icon-white"></b></a>
                  <ul class="dropdown-menu">
                    <li><a href="stuov.html">Overview</a></li>
                    <li><a href="stuov.html#adult">Just For Parents</a></li>
                  </ul>
                </li>
                 <li class="dropdown">
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">PC Kids<b class="icon-chevron-down icon-white"></b></a>
                  <ul class="dropdown-menu">
                    <li><a href="kidov.html">Overview</a></li>
                    <li><a href="kidvid.html">Videos</a></li>
                  </ul>
                </li>
                 <li class="dropdown">
                  <a href="#" class="dropdown-toggle" data-toggle="dropdown">Life Groups<b class="icon-chevron-down icon-white"></b></a>
                  <ul class="dropdown-menu">
                    <li><a href="groups.html">Schedule</a></li>
                    <li><a href="groups.html#leaders">Leaders & Group Info</a></li>
                  </ul>
                </li>
                 <li><a href="events.html">Events</a></li>
                 <li><a href="missions.html">Missions</a></li>
              </ul>
            </div><!--/.nav-collapse -->
          </div><!-- /.navbar-inner -->
        </div><!-- /.navbar -->

      </div> <!-- /.container -->
    </div><!-- /.navbar-wrapper -->

broken nav

Answer 1

我弄清楚我在寻找什么，没有查看第二个css，它有响应式css并且没有编辑.inner类的填充。

这是我的错，谢谢你

Bootstrap Navbar <li>间距</li>

1 个答案: