kaptar
@kaptar
люблю аниме и котиков

Почему при указании минимальной высоты, блоки внутри блока с высотой в процентах теряют вообще свою высоту?

Столкнулся с проблемой, и видимо это уже проблема на уровне браузеров или же самого CSS. Чтобы указать высоту объекта в процентах надо указать высоту его родителю, я указываю высоту родителя, и все работает, но как только я устанавливаю вместо постоянной величины минимальную, то высота дочернего блока спадает до своего обычного, как можно избежать этой проблемы? А также как можно сделать так, чтобы блок занимал 100% высоты экрана, и сколько бы ты не отдалял экран, у тебя он все равно бы был с 1 конца экрана до другого? Надеюсь сформулировал свой вопрос хотя бы немного понятно.
  • Вопрос задан
  • 49 просмотров
Решения вопроса 1
@ArtJH
Проблема с height: 100%, проявляющаяся, когда у родительского элемента не установлен height, но указан min-height
Вам необходимо установить height: 1px для родителя, чтобы дочерний элемент смог занять всю высоту указанную в min-height.
.parent {
    min-height: 300px;
    height: 1px; /* Требуется, чтобы дочерний блок взял высоту 100% */
}

.child {
    height: 100%;
}


2) Чтобы блок занимал всю высоту экрана задайте ему
.block{
height: 100vh;
}


Чтобы блок занимал весь экран, по ширине и высоту, то задайте ему
.block{
height: 100vh;
width: 100vw;
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

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

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