VZ
В целом тебе надо посмотреть как центровать блоки, через absolute flex grid transform
Size: a a a
2019 October 06
VZ
Сейчас не понятно, что у тебя за колбаса в желтом блоке
IM
Как обычно мы ждем код в песочнице
IM
Вот код на CodePen
IM
Помогите пожалуйста
ИЕ
задай классу left__content следующие свойства:
display: flex;
justify-content: center;
flex-direction: column;
тем самым ты выровняешь текст по центру
display: flex;
justify-content: center;
flex-direction: column;
тем самым ты выровняешь текст по центру
ИЕ
и про вендорные префиксы не забудь, чтоб в старых браузерах работало
IM
задай классу left__content следующие свойства:
display: flex;
justify-content: center;
flex-direction: column;
тем самым ты выровняешь текст по центру
display: flex;
justify-content: center;
flex-direction: column;
тем самым ты выровняешь текст по центру
То есть, она будет на уровне с logo?
IM
У меня ещё такой вопрос, а почему container не применяется?
ИЕ
То есть, она будет на уровне с logo?
нет, на уровне с лого она не будет. Чтобы была в твоем случае на уровне с лого, нужно будет добавить left__content свойство padding-left: calc(50% - 600px); где, 50% - это ширина самого left__content, а 600px это половина ширины контейнера
IM
То есть, даже если я пропишу ему <div class="container"> то он не применится?
ИЕ
У меня ещё такой вопрос, а почему container не применяется?
контейнер который ты в page обозначил? потому что left__content ты задал абсолютом. При таком поведении блок, заданный абсолютом ищет первого родителя, с position: relative и ориентируется относительно него
ИЕ
То есть, даже если я пропишу ему <div class="container"> то он не применится?
нет, не применится
IM
Спасибо большое
IM
А вот ещё один последний вопрос, а почему текст который внутри жёлтого блока располагается не под logo (в header в общем) а сверху logo ?
ИЕ
чтобы применился контейнер, нужно убрать абсолюты, убрать бекграунд. Вместо этого я бы просто добавил бекграунд псевдоэлементом, чтоб он смотрелся именно так, как тебе надо
IM
Ok, попробую завтра
IM
Спасибо большое
ИЕ
А вот ещё один последний вопрос, а почему текст который внутри жёлтого блока располагается не под logo (в header в общем) а сверху logo ?
потому что ты задал ему такое позиционирование. Абсолютное позиционирование ищет первого родителя с position: relative и ставится в те точки, которые ты ему задал. В данном случае это top: 0, left: 0. т.е. если перевести на русский, то твой желтый блок ставится относительно не page (т.к. в нем нет релатив), а header (relative есть)
ИЕ
и вот из-за точек top 0 left 0 желтый блок ставится в верхнюю левую точку твоего хедера