Как правильно такое верстать?

Здравствуйте!

Подскажите пожалуйста, как правильно верстать подобные секции - одна сторона по контейнеру выровняна (правая), а левая - впритык к экрану
5ef4e038adf2c226025251.png

Вот набросок:
  • Вопрос задан
  • 2199 просмотров
Решения вопроса 2
ArsenyMatytsyn
@ArsenyMatytsyn Куратор тега CSS
CEO iAmStudio, предприниматель.
Рассчитывай размер, исходя из макета. А с помощью CSS это можно реализовать на calc() расчетах (чтобы совпадало с макетом). Ну а если ты знаешь размер в процентах исходя из макета, или можешь легко его посчитать, то просто верстай от левого края (лучше бы ограничить, ибо странно будет выглядеть на широкоформатке), в процентах.
Ответ написан
AntonLitvinenko
@AntonLitvinenko
HTML coder
Если на сайте основным контейнером идет с бутстрапа 4, то эту конкретную секцию в контейнер заворачивать не нужно. нужно применить подобные правила:
.about-us-wrapper {
	margin-right: calc(50% - 1140px/2);
	padding-left: 15px;
	padding-right: 15px;
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 3
@eugenekazakov
Превозмогание и React
Используя css calc могут возникнуть проблемы на некоторых девайсах из-за ширины скролл бара, я для подобного использовал js
Ответ написан
@ivansedov
Можно воспользоваться margin-left: calc(50% - 50vw);, но на некоторых девайсах может появиться горизонтальный скролл, который фиксится с помощью overflow-x: hidden;
Ответ написан
Создаём 2 блока в половину ширины экрана и во второй заворачиваем блок в половину ширины контейнера.
Ответ написан
Ваш ответ на вопрос

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

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