Grid System

Supporting mobile first design standards and following media breakpoint rules.

Basic usage

HTML

here

MARKDOWN

here

Properties

(XL) – Desktop

12 column grid with a Main Content container with a maximum width of 1180 pixels. 40px gutter, 62px grid column, no gutter on outside

(LG) – Small Desktop or Large / Horizontal Orientation Tablet

12 column grid with a Main Content container with a maximum width of 1180 pixels

(MD) – Vertical Orientation Tablet or Horizontal Orientation / Large Mobile

8 column grid with a Main Content container with a maximum width of 960 pixels, 40px? 30? 64px, 26px inner padding, gutter on outside of 20px grid column

(SM) – Vertical Orientation Mobile or Horizontal Orientation Small Mobile

4 column grid with a Main Content container with a minimum width of 376 pixels, TBD

(XS) – Vertical Orientation Small Mobile

2 column grid with a Main Content container with a maximum width of 375 pixels, TBD