After close examining, not 300k lines but there are around 3-4 CSS properties that you need to override:
.navbar-collapse.collapse {
display: block!important;
}
.navbar-nav>li, .navbar-nav {
float: left !important;
}
.navbar-nav.navbar-right:last-child {
margin-right: -15px !important;
}
.navbar-right {
float: right!important;
}
And with this your menu won’t collapse.
EXPLANATION
The four CSS properties do the respective:
-
The default
.collapse
property in bootstrap hides the right-side of the menu for tablets(landscape) and phones and instead a toggle button is displayed to hide/show it. Thus this property overrides the default and persistently shows those elements. -
For the right-side menu to appear on the same line along with the left-side, we need the left-side to be floating left.
-
This property is present by default in bootstrap but not on tablet(portrait) to phone resolution. You can skip this one, it’s likely to not affect your overall navbar.
-
This keeps the right-side menu to the right while the inner elements (
li
) will follow the property 2. So we have left-side float left and right-side float right which brings them into one line.