@yagyar001

Как сделать чтобы не все элементы адаптивного меню скрывались на малых разрешениях в Bootstrap?

Всем привет. В общем ситуация такая, нужно чтобы на разрешении меньше 992px меню скрывалось за гамбургер, но не все меню, телефон должен остаться до разрешения 768px, меньше 768px, телефон должен скрыться за гамбургером. Как это реализовать в бутстрапе?
Для понимания прикладываю скриншоты из макета.
Так должно быть от 768px до 992px.
5b8f8ed6ccdcc654463386.png
Так должно быть от 0 до 768px
5b8f8ef4a8fbe705101681.png
<nav class="navbar navbar-expand-lg navbar-light">
							<div class="logo">
								<a class="navbar-brand" href="#">
									<img class="logo" src="img/logo.png" alt="Логотип">
								</a>
							</div>
				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
					<span class="navbar-toggler-icon"></span>
				</button>
				<div class="collapse navbar-collapse" id="navbarText">
					<ul class="navbar-nav mr-auto">
						<li class="nav-item main_menu_list_item">
							<a class="nav-link" href="#">Главная</a>
						</li>
						<li class="nav-item main_menu_list_item">
							<a class="nav-link" href="#">О компании</a>
						</li>
						<li class="nav-item main_menu_list_item">
							<a class="nav-link" href="#">Недвижимость и переезд</a>
						</li>
						<li class="nav-item main_menu_list_item">
							<a class="nav-link" href="#">Контакты</a>
						</li>
					</ul>
					<div class="navbar-text d-flex">
						<div class="icon">
							<img class="modal1" src="img/phone.png" alt="icon">
						</div>
						<div class="phone">
							+7 (495) 12-321-345<br>
							+7 (495) 12-321-345
						</div>
					</div>
				</div>
			</nav>
  • Вопрос задан
  • 304 просмотра
Пригласить эксперта
Ответы на вопрос 1
adik_zhuman
@adik_zhuman
Создать отдельный блок с телефонами и скрывать на тех брекпоинтах на которых хочется подробнее тут!
https://getbootstrap.com/docs/4.1/utilities/displa...
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы