flex-direction

/* CSS pro lepší čitelnost ukázky */
div div {
	width: 33%;
	font-size: 150%;
	border: 1px solid #FF0000;
	text-align: center;
}

/* Dceřinné flexibilní elementy se zarovnají do řádku */
#flex-row {
	display: flex;
	flex-direction: row;
}

/* Dceřinné flexibilní elementy se zarovnají do řádku v opačném pořadí */
#flex-row-reverse {
	display: flex;
	flex-direction: row-reverse;
}

/* Dceřinné flexibilní elementy se zarovnají do sloupečku */
#flex-column {
	display: flex;
	flex-direction: column;
}

/* Dceřinné flexibilní elementy se zarovnají do sloupečku v opačném pořadí */
#flex-column-reverse {
	display: flex;
	flex-direction: column-reverse;
}

Dceřinné flexibilní elementy se zarovnají do řádku:
<div id="flex-row">
	<div>1</div>
	<div>2</div>
	<div>3</div>
</div>

<br/> Dceřinné flexibilní elementy se zarovnají do řádku v opačném pořadí:
<div id="flex-row-reverse">
	<div>1</div>
	<div>2</div>
	<div>3</div>
</div>

<br/> Dceřinné flexibilní elementy se zarovnají do sloupečku:
<div id="flex-column">
	<div>1</div>
	<div>2</div>
	<div>3</div>
</div>

<br/> Dceřinné flexibilní elementy se zarovnají do sloupečku v opačném pořadí:
<div id="flex-column-reverse">
	<div>1</div>
	<div>2</div>
	<div>3</div>
</div>

Výsledek: