Flex Grid

The Grid consists/children that are separated by a constant gutter (30px).

• Flex Grid, Standard
• Flex Grid, Vertical space
• Flex Grid, Small Gap
• Flex Grid, Large Gap
• Flex Grid, Align: Left
• Flex Grid, Align: Center
• Flex Grid, Align: Right
• Flex Grid, Device Breakpoints
• Flex Grid, No Gutter

Understanding Device Breakpoints

We've defined a few simple breakpoints, which you can use in conjunction with the layout classes. The define at which point a column should take a different width percentage.

• Empty = Desktop
• Tablet (Landscape)
• Tablet-Portrait
• Mobile (Landscape)
• Mobile-Portrait