eantava
@eantava
Студент

Как правильно оформить вертикальное меню и контент?

Привет всем, решил впервые попробовать сверстать сайт с вертикальным меню прижатым к левому краю и контентом в центре экрана. Как правильно оформить код? Для меня это в новинку, может кто подскажет как лучше сделать или кинет ссылку на хорошую статью?
Я сделал примерно так, в body
<div class+="body">
    <div class=" right-menu"> здесь меню </div>
    <div class="left-content"> контент страницы </div>
</div>

Для body в стилях прописан дисплей flex.
Для right-menu прописана фиксированная ширина и высота на авто, дисплей flex и flex-direction columm, а в нем для блока меню прописана позиция stiky чтобы меню двигалось вместе со скролом.
Для left-content прописана фиксированная ширина контента и margin 0 auto.
Проблема в том что при адаптации на мобильные устройства колонка слева с меню занимает часть экрана. Всем заранее спасибо)
  • Вопрос задан
  • 72 просмотра
Решения вопроса 1
chincharovpc
@chincharovpc
Меню для планшетов и мобильных устройств нужно сделать с абсолютным позиционированием или скрыть за страницей с помощью transform...
В верхней части шапки расположить кнопку для открытия меню.
При нажатии на кнопку слева отображается меню и при нажатии на пустое пространство или крестик, то исчезает. (нужен javascipt)
Вот пример, смотри в моб версии
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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