Html 引导导航栏超宽错误

我把导航条放在容器外面，使nabar达到全宽。但奇怪的是，现在导航栏超过了宽度（超出预期），现在有一个水平滚动条。代码如下：

<div class="row">
<nav class="navbar navbar-default">
<div class="container">

    <section class="">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#collapse">
              <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 class="collapse navbar-collapse" id="collapse">
            <ul class="nav navbar-nav">
                <li class="active "><a href=""><span class="glyphicon glyphicon-home"></span></a></li>
                <li class=" dropdown"><a href="#" data-toggle="dropdown">text menu<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="">text menu</a></li><li><a href="">text menu</a></li><li><a href="">text menu</a></li><li><a href="">text menu</a></li>
                    </ul>                    
                </li>
                <li class="" dropdown"=""><a href="#" data-toggle="dropdown">text menu <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="">text menu</a></li><li><a href="">text menu</a></li><li><a href="">text menu</a></li>
                    </ul>
                    </li>
                <li class=" "><a href="">text menu</a></li>
                <li class=" "><a href="">text menu</a></li>
                <li class="dropdown"><a href="#" title="text menu" data-toggle="dropdown">text menu <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="" title="text menu">text menu</a></li>
                        <li><a href="" title="text menu">text menu</a></li>
                    </ul></li>
            </ul> 
            <form role="form" class="navbar-form navbar-right" id="formCari" method="GET" action="search">
            <div class="form-group has-feedback">
            <input type="search" name="q" id="q" class="form-control" placeholder="text menu">
            <i class="form-control-feedback glyphicon glyphicon-search " style="position:absolute;/*top:7px;*/"></i>
            </div>
            </form>
        </div>
        </section>

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

切换导航







问题出在父
.row
元素中，它使
.navbar
显示异常

如果从第一个div中删除类
.row
，它将正常工作

导致问题的CSS（来自引导）

将其放在
.container fluid
中？同样，这也会发生在我的带有row类的标题标记上。。
.row {
    margin-right: -15px;
    margin-left: -15px;
}