Simple grid for building column based responsive websites

Includes sass, css and minified css. (0.5KB minified + gzipped)

Examples at https://aadityataparia.github.io/Minimal-Grid/

• Simple grid is based on 12 column based design, i.e. *-1 means 100/12% width, *-2 means 100*2/12% and so on..
• To use grid, add grid class to parent element and s-*, m-* or l-* classes to children elements.
• There are three types of grid classes
  • s (used on small devices with device width < 480px)
  • m (used on medium devices with device width < 960px and > 480px)
  • l (used on large devices with device width > 960px)
• mar-* are margin classes and applies
  • mar-0: 0px margin
  • mar-s: small margin (8px)
  • mar-m: medium margin (16px)
  • mar-l: large margin (24px)
• pad-* are padding classes and applies
  • pad-0: 0px padding
  • pad-s: small padding (8px)
  • pad-m: medium padding (16px)
  • pad-l: large padding (24px)
• b-1s is border class: applies 1px solid black border
• hide-on-s class applies display: none when s classes are applied
• hide-on-m class applies display: none when m classes are applied
• hide-on-l class applies display: none when l classes are applied
• f-right class applies float: right on element
• f-left class applies float: left on element

sass file is highly configurable, most of the things are based on variables