Twitter bootstrap отзывчивая навигация исчезает после открытия и закрытия

Проблемы с Twitter Бутстрап отзывчивая навигация. Лучший способ объяснить это шаг за шагом.Twitter bootstrap отзывчивая навигация исчезает после открытия и закрытия

пойти: http://library.buffalo.edu/redesign/html/findlibrarymaterials/

Изменение размера дизайна ниже 768px

Откройте нав с помощью кнопки в правом верхнем углу, а затем закройте его

Теперь размер дизайна выше 768px

По какой-то причине навигация исчезает после того, как вы сделаете проект более крупным. Он появляется после обновления. Я уверен, что это то, что я сделал с CSS, но я не могу понять, что.

Любая помощь будет оценена по достоинству. Спасибо

источник

2012-06-19 closeyetfar

Ваш навигатор скрывается, когда применяется класс «collapse», даже если класс «in» удален. Попробуйте добавить (или не-удаление) это:

.nav-collapse.collapse { 
    height: auto !important; 
    overflow: visible !important; 
}

источник

2012-06-19 20:59:52 eterps

Я добавил это к моим основным стилям ... .nav-collapse.collapse { высота: 0; переполнение: видимое; } Кажется, исправлено сейчас. Спасибо, что направили меня в правильные стили. Я ценю вашу помощь. Cheers, Kris – closeyetfar

Нет проблем. Не могли бы вы отметить это как принятый ответ? (это зеленая галочка) – eterps

Это несколько сработало для меня, за исключением того, что вы не можете закрыть его после открытия ... – Noz

Как Etaps но использовать медиа-запрос, поэтому правило не применяется, когда ширина < $ navbarCollapseWidth:

@media (min-width: $navbarCollapseWidth + 1) { 
    .nav-collapse.collapse { 
     height: auto !important; 
     overflow: visible !important; 
    } 
}

Я использую SCSS с компасом вы может потребоваться использовать меньше синтаксиса.

источник

2013-01-25 14:30:32

Прошло несколько лет с тех пор, как на это последний раз ответил. Я ищу решение этой проблемы в Bootstrap 4, и ничего, что я нахожу, работает. Есть ли специальное/уникальное решение для BS4? – Locohost

Я очень надеюсь, что ответ Этерпса разрешит мою проблему, так как моя проблема была такой же, как описано в вопросе. Однако ответ Этерпса по какой-то причине не работал для меня.

После осмотра мой NavBar элемент на осматривайте Element Chrome, я обнаружил, что мой Navbar имел следующее свойство:

display: none;

Для меня, это то, что установил его:

.nav-collapse.collapse { 
    display: block !important; 
}

Нет необходимости для размещения медиа-запроса.

источник

2013-04-24 16:40:20

для бутстрапа 3, это свойство присутствует в вычисленных стилях по затронутой ширине. –

Twitter bootstrap отзывчивая навигация исчезает после открытия и закрытия

ответ

Смежные вопросы