How do you Pure.CSS grid?

Following are the rules to use Pure.CSS Grids:

  • Widths of Units are in fractions. For example, pure-u-1-2 represents 1/2 or 50% width, pure-u-2-5 represents 2/5 or 40% width and so on.
  • Children of Pure Grid (element with pure-g class) must be using pure-u or pure-u-* classnames.
  • All content should be a part of a grid unit to be rendered properly.