Bootstrap: отзывчивое навигационное меню

Question

На моей странице у меня есть навигационное меню. Я меняю размер страницы, но меню отображается неправильно. Кнопка, дом и изображение не установлены вертикально, а в каком-то размере они не находятся в горизонтальной плоскости.

Это мой код: JSFIDDLE

Как я могу исправить мою проблему?

Answer 1

Ширина Col NavBar-заголовка> из Col-XS-4 до Col-XS-12. Проверьте другие настройки ширины от системы сетки

 
div class="navbar-header col-xs-12 col-sm-4 col-md-4 col-lg-4" 

элементы Позиции А с левым поплавком

 
.nav-menu .navbar-header a{ 
    float: left; 
} 

меню установки тумблер с левым поплавком

 
.navbar-toggle { 
    float: left; 
} 

Answer 2

, что происходит, потому что ваш заголовок нав не получил width установить

.navbar-header { 
    width:100%; 
} 

и теперь оно должно быть хорошо!
demo

РЕДАКТИРОВАТЬ

после удаления из col-xs-4 col-sm-4 col-md-4 col-lg-4<div class="navbar-header"> still looks fine