muxui
@muxui
пишу так, как другие боятся

Как задать высоту блока равной высоте viewport?

Привет!
У меня две проблемки:
1) В UIKit 3 есть .uk-height-viewport - https://asuikit.com/v3/height
Применяю вот так:
<div class="uk-width-1-2 uk-overflow-auto uk-height-viewport">

Но можно и вот так:
<div class="uk-width-1-2 uk-overflow-auto" uk-height-viewport>

Второй вариант не работает, совсем.
В CSS я сделал так (заменил 100vh на 90vh):
.uk-height-viewport {
  max-height: 90vh;
}

И тут возникла дилемма, 100 vh - уходили ниже разрешения viewport'a, а 90 - в самый раз. Но только для моего монитора (1920x1080).
Как мне сделать адаптивную ширину во весь viewport (для меня это +- 980 px наверное. Проще говоря - окно, где помещается весь сайт)?
2) Я сделал сетку через uk-grid:
<div class="uk-flex-center" uk-grid>
	<div class="uk-width-1-2 uk-overflow-auto uk-height-viewport">

Вот скриншот-макет:
5e29ec598491d639313750.png
По стандарту у меня два этих блока идут по центру:
Левый блок идет чуть левее, а правый - чуть правее. Но мне бы хотелось точь-в-точь как на скриншоте: левый блок идет строго по центру, а правый - справа от центрального. Как такое сделать? Двойной grid?
  • Вопрос задан
  • 74 просмотра
Решения вопроса 1
asuikit
@asuikit
Скидываю пару примеров ответом на п.2, но думаю здесь одновременно решение и на п.1., на который не увидел код.
Вариант первый:

..
второй вложенный.
для понимания первую строку и суть брал с самого вопроса

..
Ширину блоков можно менять. там вопросов не должно быть
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
SoftAge Новосибирск
До 200 000 ₽
SoftAge Новосибирск
До 150 000 ₽
от 80 000 до 200 000 ₽