CSS flex-direction

Previous Next

Demo of the different values of the flex-direction property.

Click the property values below to see the result:

flex-direction: row;
flex-direction: row-reverse;
flex-direction: column;
flex-direction: column-reverse;



red div
blue div
yellow div
pink div



red div
blue div
yellow div
pink div



red div
blue div
yellow div
pink div



red div
blue div
yellow div
pink div

Play more with the code in our Tryit yourself editor: Try it Yourself ❯