CSS-переходы для изменения макета (поскольку в DOM отображаются другие элементы)? ⇐ CSS

[Anonymous]

При отображении нового блока другие блоки могут перемещаться по странице.

Можно ли использовать переходы CSS для анимации перемещения блока, когда другой блок отображается?

Исходное состояние:




Последующее состояние:

< img alt="введите здесь описание изображения" src="https://i.sstatic.net/Ma22L.png" />

Например:

• Изначально отображается только синий блок.
• Отображается зеленый блок, при этом синий блок сдвигается вниз.
• Я бы хотел, чтобы синий блок анимировал перемещение на новую позицию

Обязательный JSFiddle
Можно ли анимировать перемещение синего блока в новое положение? У меня CSS-переход установлен как для блоков, так и для их родителей. p>

Или (как я начинаю подозревать) CSS-переходы предназначены только для реальных изменений CSS, а а не для последующих эффектов этих изменений CSS?

Подробнее здесь: https://stackoverflow.com/questions/234 ... in-the-dom