Direction

Control the direction the main axis runs in with the { row | column } direction modifiers. By default it's set to row.

Default styling
Item 1
Item 2
Item 3
column
Lay out items in a column.
Item 1
Item 2
Item 3
column%3Areverse
lay out items in a column from right to left.
Item 1
Item 2
Item 3
row
Lay out items in a row.
Item 1
Item 2
Item 3
row%3Areverse
lay out items in a row from right to left.
Item 1
Item 2
Item 3
Markup

Toggle example guides Toggle HTML markup 

<div pam-flex="[modifier]" pam-space="p:2" pam-skin="bg:gray:100">
    <div pam-skin="bg:gray:300" pam-space="p:4 mr:2 mb:2">Item 1</div>
    <div pam-skin="bg:gray:300" pam-space="p:4 mr:2 mb:2">Item 2</div>
    <div pam-skin="bg:gray:300" pam-space="p:4 mr:2 mb:2">Item 3</div>
</div>