Is It Possible To Animate Flexbox Inserts, Removes, And Item Position?

This question was originally asked back in 2012 however the answers provide did not cover the use case I'm interested in (smooth movement for wrapped content changing lines). 'Whe

Solution 1:

I could do it, and it's a litle tricky https://codepen.io/balvin/pen/wXGyYw

Without wrap, it's easier https://codepen.io/balvin/pen/gKrXdM basically yo need to set all your flex items to width:0;flex-grow:1 but when you want it to work with wrap it becomes a little harder because the items need to have width in order to be avaible to wrap them, so with some setTimeout I can acomplish that

Solution 2:

Short answer is no (or at least not yet). Flex-order is in fact animatable, because it would go one position at a time between your desired positions, in the given timeframe, but you will not get that smooth translation of elements.