display : flex;

Red box set display : flex and set...

justify-content

1
2
3

align-items

1
2
3

flex-direction

1
2
3

flex-wrap

1
2
3
4
5
6
7
8

Center/Middle

Red box is a regular DIV box, and Purple cube is display : inline-block

vertical-align

vertical-aling attribute only applies on inline items.

h:200px
this is inline text for reference.
top
text-top
middle
text-bottom
bottom

text-align

Hello