You need to make it so that in bootstrap 3 nav on a small screen size (<768px) when you click the drop-down menu button
photo dropdown menu

the drop-down menu pushed the bottom part of the content, and did not fit it, as in the example:
browser view photo Here is the code:

<nav class="navbar navbar-defaul " role="navigation"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse"> <span class="sr-only">МЕНЮ</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="collapse navbar-collapse" id="navbar-collapse"> <ul class="nav navbar-nav navbar-right"> <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> </div> </nav>


Here is the css-code:

 .info { width: 100%; height: 750px; background: url(../res/infobg.png) ; background-position: center; } .info .menu{ height: 25px; } .menu ul { width: 100%; } .menu ul li{ width: 14.28571428571429%; } .menu a { text-align: center; color: #fff; font-family: 'Roboto', regular; font-size: 18px; } .menu a:hover , .menu a:focus{ background-color:rgba(0,0,0,0.1) !important; } button.navbar-toggle { background-color: white; } span.icon-bar { background-color: #095C9F; } @media only screen and (max-width : 768px) { .menu li { width: 100% !important; }

    1 answer 1

    The answer was to remove this line of css-code:

     .info .menu{ height: 25px; }