Change bootstrap navbar collapse breakpoint without using LESS

前端 未结 19 2451
囚心锁ツ
囚心锁ツ 2020-11-22 07:55

Currently when the browser width drops below 768px, the navbar changes to collapsed mode. I want to change this width to 1000px so when the browser is below 1000px the navba

19条回答
  •  谎友^
    谎友^ (楼主)
    2020-11-22 08:43

    Finally worked out how to change the collapse width by fiddling with '@grid-float-breakpoint' at http://getbootstrap.com/customize/.

    Go to line 2923 in bootstrap.css(also min version) and change @media screen and (min-width: 768px) { to @media screen and (min-width: 1000px) {

    So the code will end up being:

    @media screen and (min-width: 1000px) {
      .navbar-brand {
        float: left;
        margin-right: 5px;
        margin-left: -15px;
      }
      .navbar-nav {
        float: left;
        margin-top: 0;
        margin-bottom: 0;
      }
      .navbar-nav > li {
        float: left;
      }
      .navbar-nav > li > a {
        border-radius: 0;
      }
      .navbar-nav.pull-right {
        float: right;
        width: auto;
      }
      .navbar-toggle {
        position: relative;
        top: auto;
        left: auto;
        display: none;
      }
      .nav-collapse.collapse {
        display: block !important;
        height: auto !important;
        overflow: visible !important;
      }
    }
    

提交回复
热议问题