Адаптивное меню бутстрап

215
13 апреля 2018, 13:32

Проблема вот в чем: В адаптивном меню вложенные ссылки открываются как в десктопе (скрины прикладываю как есть и как должнобыть). Подскажите пжлст что накосячил.

@media screen and (max-device-width: 768px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 40px;
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
    .navbar-nav{
        font-size:40px;
        text-align: center;
    }
}
<nav class="navbar navbar-default">
            <div class="container-fluid">
                <div class="navbar-header col-xs-12">
                    <div class="icons col-xs-5">
                    <span class="glyphicon glyphicon-earphone"></span>
                    <span class="glyphicon glyphicon-envelope"></span></div>
                    <div class="logo col-xs-7"><img class="navbar-brand" src="img/logo.png" width="" alt=""></div>
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                </div>
                <div id="navbar" class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">О компании<span class="caret"></span></a>
                            <ul class="dropdown-menu">
                                <li><a href="#" >О компании</a></li>
                                <li><a href="#">Новости</a></li>
                                <li><a href="#">Подразделения</a></li>
                                <li><a href="#">Производство</a></li>
                                <li><a href="#">Дипломы и сертификаты</a></li>
                                <li><a href="#">Заказчики</a></li>
                                <li><a href="#">Отзывы клиентов</a></li>
                                <li><a href="#">Магазины "СтеллажМастер"</a></li>
                                <li><a href="#">Контакты</a></li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Каталог<span class="caret"></span></a>
                            <ul class="dropdown-menu">
                                <li><a href="#">Стеллажи</a></li>
                                <li><a href="#">Паллетные фронтальные</a></li>
                                <li><a href="#">Паллетные глубинные</a></li>
                                <li><a href="#">Мезонины</a></li>
                                <li><a href="#">Платформенные мезонины</a></li>
                                <li><a href="#">Среднегрузовые полочные</a></li>
                                <li><a href="#">Полочные( от 80 до 200кг на полку)</a></li>
                                <li><a href="#">Бытовые стеллажи</a></li>
                                <li><a href="#">Сетчатый настил</a></li>
                                <li><a href="#">Пластиковая тара</a></li>
                                <li><a href="#">Мусорные контейнеры</a></li>
                            </ul>
                        </li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Услуги<span class="caret"></span></a>
                            <ul class="dropdown-menu">
                                <li><a href="#">Проектирование</a></li>
                                <li><a href="#">Доставка</a></li>
                                <li><a href="#">Монтаж и шеф-монтаж</a></li>
                                <li><a href="#">Ремонт стеллажей и оборудования</a></li>
                                <li><a href="#">Консультационная поддержка</a></li>
                            </ul>
                        </li>
                        <li><a href="#">Диллеры</a></li>
                        <li><a href="#">Реализованые проекты</a></li>
                        <li class="dropdown">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Контакты<span class="caret"></span></a>
                            <ul class="dropdown-menu">
                                <li><a href="#">Предложения и пожелания</a></li>
                                <li><a href="#">Контакты</a></li>
                                <li><a href="#">Письмо директору</a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>

READ ALSO
Построчный перевод HTML в XML

Построчный перевод HTML в XML

Есть структура в HTML следующего вида:

180
Действие с элементом при нажатии

Действие с элементом при нажатии

Здравствуйте, есть таблица в html с ячейками, у каждой ячейки один и обработчик:

197
HTML код в JS без кавычек. Как это реализовано в React?

HTML код в JS без кавычек. Как это реализовано в React?

В методе ReactDOMrender React-a мы можем объявлять компоненты сразу HTML кодом

187
Не работает click в javascript, нужна помощь

Не работает click в javascript, нужна помощь

Всем привет, народ начинаю изучать js, вот есть скритец:

230