Как запретить перевод блоков на новые строки? (и объединить то, что не вмещается?)

уважаемые гуру!
Я использую yii2 (просто для информации) и встроенный в него bootstrap-3. Так вот - в классе navbar мне необходимы блоки: отдельные слева, отдельные справа. Когда ширина достаточная - все нарисовано красиво. В мобильном приложении - все тоже сворачивается, как положено. Но если немного изменить размер страницы: не на весь экран, появляются проблемы:

  1. Лого остается на первой строке
  2. Левый блок уходит на вторую строку (а если полностью не вмещается, то уходит уже и на третью)
  3. Правый блок оказывается уже на четвертой строке.
    введите сюда описание изображения Из вариантов, которые находил, советовали убрать float:left добавить dispaly:inline-block и применить стиль white-space:nowrap но если убрать float:left, то правая колонка начинает наезжать на левую.

Вопрос: Можно сделать так, чтобы все умещалось в одну строку, не наезжая друг на друга?
Либо сделать например, что: если все пункты меню не вмещаются, то: все, что не вмещается, уходит в отдельный раскрывающийся пункт меню (но именно это по-моему в bootstrap3 невозможно, т.к. не нашел вообще никакой информации об этом).
Либо более безумный вариант: все, что не вмещается, уходит в collapse, а что вмещается, остается как положено?
Пример тут


Ответы (0 шт):