@ImagineWorld

Мобильное меню прокручивается не до конца, в чём причина?

Есть адаптивное меню.
Вот как оно выглядит на маленькой высоте устройства
5f34f38b9401d420224780.png А вот как должно.
5f34f50ae15e4868506503.png

Однако при скролле на небольшой высоте, он прокручивается не до конца и пункта "Выхю:од" не видно, как это можно исправить.

Вот код меню:

<div class=barmenu>
        <div class=bar1>
        </div>
        <div class=bar2>
        </div>
        <div class=bar3>
        </div>
        <ul class=menu__box>
                <li>
                    <a class="menu__item main-page"> Главная</a>
                        <li>
                             <a class="menu__item session-reports-link" href=#>Отчёты по сессиям</a>
                              <li>
                                <a class="menu__item payments-reports">Отчёты по платежам</a>
                                  <li>
                                   <a class="menu__item cardpay">Пополнить</a>
                                      <li>
                                     <a class="menu__item creditpay">Кредит</a>
                                      <li>
                                      <a class="menu__item payments-methods">Способ оплаты</a>
                                        <li>
                                           <a class="menu__item recalculation">Перерасчет</a>
                                           <li>
                                               <a class="menu__item myprofile">Профиль</a>
                                              <li>
                                               <a class="menu__item ">Услуги</a>
                                                 <li>
                                                  <a class="menu__item tarif">Тарифы</a>
                                                  <li>
                                                   <a class=menu__item>Подключить друга</a>
                                                   <li>
                                                    <a class=menu__item>Оставить заявку</a>
                                                      <li>
                                                    <a class="menu__item iptv">IPTV</a>
                                                      <li>
                                                        <a class=menu__item>Видеопортал</a>
                                                         <li>
                                                          <a class="menu__item exit"> Выход</a>
                                                           <li>
                                                          </li>
                                                           </ul>
                                                 </div>


.barmenu {
	display: none;
  }
  .menu__box {
	display: block;
	position: fixed;
	visibility: hidden;
	overflow:auto;
	transition:0.7s;
	top: 50px;
	left: -100%;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 20px 0 20px 0;
	list-style: none;
	text-align: center;
	background-color: #ECEFF1;
	box-shadow: 1px 0px 6px rgba(0, 0, 0, .2);
	z-index:9999;
  }
  /* элементы меню */
  .menu__item {
	display: block;
	padding: 12px 24px;
	color: #333;
	font-family: 'Roboto', sans-serif;
	font-size: 20px;
	font-weight: 600;
	text-decoration: none;
  }
  .menu__item:hover {
	cursor: pointer;
	background-color: #68ABE9;
  }
  • Вопрос задан
  • 176 просмотров
Решения вопроса 1
@ImagineWorld Автор вопроса
Решил следующим образом: задал для меню height:auto; и bottom:0;
Хз что это дало, но помогло.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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