Как расположить флексами «детей» по диагонали «родителя» без JS?

Question

[Darya Shvakh]

Добрый день!
Скажите пожалуйста как можно расположить дочерние дивы по диагонали родителя без JS.
В идеале это конечно реализовать на флекс-боксах, но как ?
Мой вариант всего родителя разлиновывать, как шахматную доску и скрывать все клетки-дивы кроме тех, что по диагонали, но может есть ещё варианты?
И "детей по углам" предполагаю позиционировать абсолютом относительно релятива родителя, но может их так-же можно как-то флексами? И они потом "ответят" - адаптивной благодарностью:)
Спасибо!
P/S Визуализирую этот "поток сознания и некомпетентности"

Answer 1

[Владимир Проскурин]

Можно создать под-родителя с отступом на одну ширину. И просто каждый блок кидать в такого родителя

папа
  под-папа
    блок
    под-папа
       блок

таким образом, каждый следующий будет правее.

Comments

[Darya Shvakh]

Владимир Проскурин, т.е. согласно скрина, у меня должно быть четыре под-папы (не важно по Х или Y) и по одному ребёнку в каждом, которым задавать или маржины или падинги в %, vh или vw, или блоки распорки ?

Answer 2

[alekseydemyanenko]

align-self
start -для первого
end- последний
2и3 -center
3- margin-top.

Comments

[Darya Shvakh]

alekseydemyanenko, Спасибо!
Учу, что вы задали:)

[snap44]

Daria Shvakh, Тыц

[Darya Shvakh]

snap44, занятно:)
Спасибо!

[snap44]

Daria Shvakh, пожалуйста. Если есть возможность купить подписку в htmlacademy (390р на месяц), у них вроде есть такое задание в курсах по флексам.

[alekseydemyanenko]

snap44, жаба классная, тренировался там )