Twitter Прокрутка меню Navigator

Ответ 1

Это новое для Bootstrap 3.

Лучший способ сделать это - удалить или прокомментировать строки 52 и 53 в /less/navbar.less: https://github.com/twbs/bootstrap/blob/master/less/navbar.less#L52-53 (вы можете дополнительно удалить строка 59) и перекомпилируйте bootstrap.less.

Если вы не можете перекомпилировать Bootstrap с помощью такого инструмента, как CodeKit или Grunt, вы захотите написать медиа-запрос в своем документе css, который выделяет и перезаписывает класс .navbar-collapse, возможно, так:

@media (max-width: 767px) {
   .navbar-collapse {
      max-height: auto;
      overflow-x: auto;
   }
}

Я не тестировал этот код выше - так как мне удалось перекомпилировать. Возможно, вам придется включить! Важно или что-то в этом роде.

Ответ 2

Это должно быть сделано (если вы соблюдаете правила CSS 3.0)

 max-height: none;

Ответ 3

Чтобы удалить вертикальную полосу прокрутки, этот бит CSS работал. У меня не было горизонтальных полос прокрутки.

@media (max-width: 767px) {
   .navbar-collapse {
      max-height: none;
   }
}

Ответ 4

Я просто наткнулся на это сам...

Просто абсолютно позиция .navbar-default.

Разделитель .navbar-collapse абсолютно позиционируется, и вам нужно "прикрепить" его к элементу parent/ancestor, который не статически расположен. Итак, я просто добавил:

.navbar-default {
    position: absolute;
}

Не знаю о Bootstrap 4 (который только что выпустил альфа), но это похоже на трюк с Bootstrap 3 nav. У меня очень длинный навигатор, и теперь я могу правильно прокрутить вниз и увидеть все навигационные элементы.

Ответ 5

Другое решение в Boostrap 3.3.4 добавляет следующее к вашему CSS:

/* No scrolling for collapsed menu */

.navbar-collapse.in {
    overflow: hidden;
    max-height: none !important;
    height: auto !important;
}