Переход при смене макета ⇐ CSS

[Anonymous]

Переход при изменении макета
У меня есть родительский контейнер с двумя дочерними элементами внутри: child1 и child2. Родительский контейнер имеет свойство отображения, установленное на «flex» с направлением «строка», но для экранов размером более 768 пикселей я хочу, чтобы оно изменилось на направление «flex-col». Как я могу добавить плавный переход к этому изменению макета, чтобы при увеличении размера экрана с 768 пикселей или выше и изменении направления изгиба переход происходил плавно, а не резко?
.родитель { дисплей: гибкий; переход: все 0,3 с; } .child1, .child2{ ширина: 100 пикселей; высота: 100 пикселей; } .child1{ фон: красный; } .child1{ фон: синий; } @media (минимальная ширина: 768 пикселей) { .родитель { гибкое направление: столбец; } }