Задать вопрос
Cheizer
@Cheizer
html

Как сверстать отступ сверху у этой чудной HTML структуры (кирпичная кладка — адаптив)?

Ребята, помогите пожалуйста, всю голову сломал, уже какой день бьюсь и не могу никак сделать отступ сверху в 70зч этой чудной верстки. Задача такая, что бы по высоте все это было в 100vh, НО внутри блока должен быть отступ сверху в 70px. Остальная "кирпичная кладка должна занимать все остальное пространство по высоте и ширине, вроде с горем пополам сделал эту структуру, все адаптивно и по высоте норм, но если добавляю отступ, все это не влезает в 100vh :( помогите пожалуйста!

Есть заготовка https://codepen.io/Cheizer/pen/RZOXMG как сделать отступ сверху в 70px что бы все влазило в 100vh по высоте?

814b03dcebb14810afbab99bfa5387af.jpg
  • Вопрос задан
  • 793 просмотра
2 комментария
Подписаться 3 Оценить 2 комментария
Решения вопроса 1
kleinmaximus
@kleinmaximus
Senior Full-stack Javascript Developer
Можно через flex: https://jsfiddle.net/upj1oa1m/6/
Ответ написан
2 комментария
2 комментария
Пригласить эксперта
Ответы на вопрос 2
LenovoId
@LenovoId
svg, css,js
на ютубе есть видео о css-grid -в 5 строк реализуется
либо js плагины типа - masonry
Ответ написан
1 комментарий
1 комментарий
Astrohas
@Astrohas
Python/Django Developer 
.stranniy-block-wrapper{
    box-sizing: border-box;
    height: 100vh;
    padding-top: 70px;
}

насчет кирпичей, можно сделать тремя способами:
1) Masonry
2) Вручную разбить на блоки и субблоки
3) Таблицы (!)
Ответ написан
1 комментарий
1 комментарий
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Разработка дизайна раздела «Статьи» на сайте «Мир отходов»
23 апр. 2024, в 23:01
10000 руб./за проект
Дизайн личного кабинета (клиентская часть)
23 апр. 2024, в 22:37
500 руб./в час
Скрипт для Solana быстрый
23 апр. 2024, в 22:33
25000 руб./за проект
Ещё заказы