How to disable navbar in Twitter Bootstrap 3 to stack toggle button into new line, when the page is accessed via mobile phone?
I always get something like this:
(source: toile-libre.org)
I’ve tried everything, from adding custom CSS to modifying .less
files and further recompiling the whole Bootstrap style (I’ve been changing @grid-float-breakpoint
variable and I even have played with navbar.less
), but unfortunately I had no success.
Can somebody help me, please? I’m desperate because I’ve lost a whole day trying to fix this.
3
Answers
Solved it, I had to add
width
attribute to the div container which has these two buttons from the right. The div was improperly resizing, hence it was putting the second (toggle) button in the new line.try removing the collapse class from the menu, and deleting the button:
The
.navbar-toggle
has propertyfloat: right;
. Check the HTML-code of yournavbar
. The toggle button should be placed first, before the other parts of the menu.