Navigation Menu

Skip to content

joshnh/lightweight-nestable-grid

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

49 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Lan Grid System

Lightweight & Nestable

Usage:
  1. Set an element as a container by using the grid class.
  2. Declare columns using BEM syntax (grid__col--{width}).
  3. You're all done!

Notes:
  • You need to use block-level elements when declaring containers and columns.
  • White space between columns needs to be commented out in your markup.
  • To nest columns, simply use the grid class on each parent column.
  • Keep your grid abstracted by using dedicated elements to avoid style conflicts.

Example:
<div class="grid">
	<div class="grid  grid__col--67">
		<div class="grid__col--50">
			…
		</div><!--
	 --><div class="grid__col--50">
			…
		</div>
	</div><!--
 --><div class="grid__col--33">
		…
	</div>
</div>

Releases

No releases published

Packages

No packages published