/responsive-grid

stylesheet for a responsive grid layout using CSS Flex

Primary LanguageHTML

#Responsive Grid

##Less options means less headaches.

###How to use:

  1. Add the css file <link rel="stylesheet" href="./css/responsive-grid.min.css">

  2. and create your grid like this

<div class="row center">
  <div class="col">
  </div>
  <div class="col">
  </div>
  <div class="col">
  </div>
  <div class="col">
  </div>
 </div>

###Column classes:

.col - auto width to fill the entire row

.full - full-width, 100%

.col-1of2, .col-1of3, .col-1of4 - the width is 1/2,1/3 or 1/4 of the row

.sm-1of2, .sm-full, lg-1of2. lg-full etc.

###Row alignments: .start, .end, .center

###Column alignments:

.align-top, .align-bottom, .align-center