3 элемента на странице, всего 100vh, одна высота неизвестна

0

Изображение 174551

На рисунке показано, чего я хочу достичь. Я не хочу объявлять высоту для навигационной панели, она может быть гибкой в зависимости от устройства.

"Кодекс", на мой взгляд, должен был бы выглядеть так:

"100vh - navbar = свободное место", создайте div "доступного пространства" и используйте процент в типичном режиме.

Не знаю, как это выполнить, кто-нибудь PLS?

Теги:
responsive-design
percentage
height

1 ответ

1

для navbar я бы рекомендовал вам использовать bootstrap navbar

- navbar

- статическая верхняя панель навигации

- navbar fixed top, хорошо для вашего дела, я бы сказал

то вы можете просто сделать это

<div id="logo" style="width:100%;height:40%"></div>
<div id="imageslider" style="width:100%;height:60%"></div>
  • 0
    Хорошей новостью является то, что я уже использую Bootstrap, так что, возможно, это может сработать. Если навигационная панель зафиксирована, она выходит из естественного потока, поэтому не заставит ли логотип частично закрыться навигационной панелью? У меня это было исправлено в какой-то момент, но это вызывало такие проблемы, я исправил их с множеством <br>, но на мобильных устройствах это было довольно непредсказуемо.
  • 0
    Я также думаю о том, чтобы сделать так, как вы предлагали, но перед ЛОГОТИПОМ и СЛАЙДЕРОМ поставить еще одну навигационную панель - пустую, без ссылок, просто чтобы занять необходимое пространство. Я попробую сделать это таким образом, если это сработает, я приму ваш ответ :) Спасибо!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню