Bootstrap navbar collapse media-query on custom width

前端 未结 4 1034
野的像风
野的像风 2020-12-14 09:57

Helo guys, I want to modify the navbar in order to collapse on @screen-md :992px;. I have modified navbar.less, but still not working and I don\'t

4条回答
  •  一生所求
    2020-12-14 10:26

    You can change the collapse point in 3.1 like this..

    @media (max-width: 992px) {
        .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: 10px;
            padding-bottom: 10px;
        }
        .collapse.in{
            display:block !important;
        }
    }
    

    http://www.bootply.com/120951


    In Bootstrap 4, changing the breakpoint is easier. See this answer

提交回复
热议问题