Как сделать так через css?

Question

[Станислав Пономарев]

Народ, как сделать такое расположение блоков через css? Синий блок находится в центре по вертикали, а зеленый с отступом от синего в 20px

Answer 1

[html-css]

Как то так
тЫц

Comments

[Станислав Пономарев]

html-css html-css Чего-то я не понимаю...вместо align-items-center здесь нужно использовать justify-content: center; flex-direction: column;
С before тоже непонятки. Разве он не используется перед элементом? А зеленый блок находится после синего

[html-css]

Станислав Пономарев, без разницы
без разницы, можно через before,after - он же позиционируется абсолютно, т.е будет всеровно выше синего

aligni-items задает выравнивание по вертикали
justify-content по горизонтали

[Станислав Пономарев]

html-css html-css было бы так, если флекс не делал блоки строчными. Чтоб их расположить по вертикале нужно flex-direction: column; разве нет?

[html-css]

Станислав Пономарев, да. хз
сделайте display:grid
и те же свойства пропишите контейнеру

[html-css]

Как то так
тЫц

[Станислав Пономарев]

html-css html-css чувак это круто! Спасибо тебе огромное) только с функционалом проблема)

[Станислав Пономарев]

html-css html-css вот из-за этого

[html-css]

Станислав Пономарев, так замените на content"блаблабла";
в общем хотелось бы видеть для начала код, или т.з
т.к мало что понимаю по скринам что нужно