This is a handy page with various columns and content aligned and positioned in various ways.
Use this page to understand how the position stack and flex classes work.
2
This column is right on large screens but top when it stacks on small screens
1
This column is left on large screens but bottom when it stacks on small screens
This text is centre aligned in the middle of the column.
This text floats in the middle of the column.
This text floats in the bottom of the column.
This text floats in the middle of the grid.
This text floats in the top-centre of the grid.
This text floats in the bottom-centre of the grid.
1
2
3
4
5
This grid contains cards and is set to centrally align all content regardless of how they stack. This is especially useful if you have a grid of uneven number width stacks but want everything aligned as it stacks.