@php7788

Как сделать так чтобы background-color был на весь экран браузера?

Здравствуйте, есть header, div с классом mainblock и footer.

Мне нужно сделать так чтобы bg-color первого блока был на всю ширину и высоту окна браузера. Я попытался сделать это с помощью min-height: 100vh;

Вышло вот так: 603e5ef408738486502484.png

К хедеру не применяется bg-color + не видно контента этого основного блока. А если пытаюсь поставить pos:absolute с top 0 и left 0. То получается еще хуже, футер поднимается наверх. Какое есть решение? Это возможно решить? Или только картинку можно поставить правильно
  • Вопрос задан
  • 150 просмотров
Пригласить эксперта
Ответы на вопрос 1
kryamk
@kryamk
1. Сделать первую секцию 100vh, в неё бахнуть шапку, задать секции цвет
2. Шапке высоту скажем 50px, первой секции calc(100vh - 50px). Обоим задать нужный цвет
3. Добавить дополнительную секцию с цветом, абсолютно спозиционировать, высоту 100vh, раскидать z-index, а высоту шапки и первой секции как во втором пункте
4. Задать цвет боди, а шапку и первую секцию как во втором пункте
5. Плюнуть на всё и пойти бухать
6. Добавить дополнительный псевдоэлемент с цветом вместо секции как в третьем пункте
7. Задать отдельную фиксированную высоту и прописать в медиазапросах для каждого пикселя
8. Сказать дизайнеру чтобы всё переделывал, а то понапридумывают всякого
9. Шапку фиксированную сделать, а секции 100vh
Ответ написан
Ваш ответ на вопрос

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

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