order

Last Updated: March 29, 2022

You can specify how you want to lay the child elements inside the container. By default, it is the source order.

You can add order property to the flex items so that they will appear according to the order you specify.

Original Order

1
2
3
4
5

Changed Order

Now the order has been changed using the CSS order property

div:nth-child(1){
  order:2
}
div:nth-child(2){
  order:3
}
div:nth-child(3){
  order:1
}
div:nth-child(4){
  order:4
}
div:nth-child(5){
  order:5
}
1
2
3
4
5
Test