Меняем точку схлопывания меню Navbar Bootstrap 3

О чем сейчас пойдет речь? В bootstrap 3 главное меню адаптивно и при размере менее 768 px (xs) оно не показывается. Открытие происходит по нажатию на кнопку. Иногда меню такое большое, что на планшетном размере 768-991 px (sm) не влазит в отведеное для него место, и есть смысл сделать его также схлопнутым, как и на мобильном разрешении. Делаем это следующим образом:

В таблицу стилей добавляем стили:

@media (max-width: 991px) {
header .navbar-header {float: none;}
header .navbar-toggle {display: block;}
header .navbar-collapse {border-top: 1px solid transparent;box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);}
header .navbar-collapse.collapse {display: none!important;}
header .navbar-nav {float: none!important;margin:0;}
header .navbar-nav>li {float: none;display: block;}
header .navbar-nav>li>a {padding: 10px 18px;}
header .collapse.in{display:block !important;}
}

После этого при размере менее 992 px меню будет себя вести также, как и на мобильном.