summaryrefslogtreecommitdiff
path: root/3 resources/css/Flexbox.md
blob: 04d5af2483f9d8ccf1c9b10c1a6e5aa6df075164 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
#css 

---
Flexbox deals with layout always in only one dimension; it's possible to specify which dimension: either vertical or horizontal.

Two axes: main and cross

Control main axis: `flex-direction: row|row-reverse|column|column-reverse`. The first two make it a horizontal layout and the latter make it a vertical layout.

Cross axis is always the opposite of `flex-direction`, so if `flex-direction: row-reverse` the cross axis is `column-reverse`.

The writing mode determines where the start and end are, based on for example languages. Japanese is written from right-to-left rather than western left-to-right.
So while in Europe the start of a flexbox is at the left and the end at the right in Japan this would be reversed.