Подскажите, как выравнить все пункты меню на одном уровне, а то последний пункт переносится на другую строку.
<div class="navbar">
<div class="container">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="nav-collapse collapse navbar-responsive-collapse text-">
<ul class="nav">
<li class="col-sm-2"><a href="#slide-1">Главная</a></li>
<li class="col-sm-2"><a href="#slide-2">Услуги</a></li>
<li class="col-sm-2"><a href="#slide-3">Text клиенты</a></li>
<li class="col-sm-2"><a href="#slide-4">Text Text</a></li>
<li class="col-sm-2"><a href="#slide-5">Text работы</a></li>
<li class="col-sm-2"><a href="#slide-6">Отзывы</a></li>
<li class="col-sm-2"><a href="#slide-7">Контакты</a></li>
</ul>
<div class="row">
<div class="col-sm-2 active-menu"></div>
</div>
</div>
</div>
</div>
Обновление
Я написал следущий код
<ul class="nav m">
<li class="col-sm-1"><a href="#slide-1">Главная</a></li>
<li class="col-sm-2"><a href="#slide-2">Услуги</a></li>
<li class="col-sm-2"><a href="#slide-3">Text клиенты</a></li>
<li class="col-sm-2"><a href="#slide-4">Text Text</a></li>
<li class="col-sm-2"><a href="#slide-5">Text работы</a></li>
<li class="col-sm-2"><a href="#slide-6">Отзывы</a></li>
<li class="col-sm-1"><a href="#slide-7">Контакты</a></li>
</ul>
Но пункты становятся кривыми. Как выровнять?