Bootstrap较小的Navbar折叠宽度

Question

我有一个问题，我整天都在寻找答案而没有找到答案。 代码：

<div class="visible-xs navbar navbar-ti navbar-fixed-top ">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle pull-left" data-toggle="collapse" data-target="#navbar" >
        <span class="glyphicon glyphicon-menu-hamburger white"></span>
      </button>
        <button type="button" class="navbar-toggle collapsed pull-right">
        <span class="glyphicon glyphicon-search white"></span>
      </button>
    </div>
    <div id="navbar" class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li><a href="wheretobuy.aspx"  style="color:#fff;" >Where to Buy</a></li>
        <li><a href="cookware.aspx" style="color:#fff;" >Cookware Sets</a></li>
        <li><a href="registration.aspx"  style="color:#fff;" >Register Product</a></li>
        <li><a href="qualitystandards.aspx"  style="color:#fff;" >Quality Standards</a></li>
        <li><a href="customerreviews.aspx"  style="color:#fff;" >Customer Reviews</a></li>
        <li><a href="rvinfo.aspx"style="color:#fff;" >RV Information</a></li>
        <li><a href="marineinfo.aspx"  style="color:#fff;" >Marine Information</a></li>
        <li><a href="aboutus.aspx"  style="color:#fff;" >About Us</a></li>
        <li><a href="contactus.aspx"  style="color:#fff;" >Contact Us</a></li>
      </ul>
    </div>
  </div>
</div>

我添加到bootstrap.css：

.white {
color: #fff !important; }.navbar-ti {
background-color:#200c03;}

我需要像图片一样设置折叠导航的宽度，我想删除箭头所指向的线。 ：）

我使用bootstrap 3.4并且我没有改变任何东西到bootstrap.css只是添加了一些类。有人能帮我吗 ？

P.S抱歉英语不好:)。

Answer 1

该水平线由box-shadow元素上设置的.navbar-collapse属性生成。在bootstrap.css中添加以下规则：

.navbar-collapse {  
  box-shadow: 0 0 0; // remove box-shadow
}