<div class="container"> <div class="row"> <div class="col-4"> <!-- 4 Column Bucket--> </div> <div class="col-4"> <!-- 4 Column Bucket--> </div> <div class="col-4"> <!-- 4 Column Bucket--> </div> </div> </div>
Step1. Create a container
Your markup needs at least one container to hold the rows that'll hold your columns.
Step2. Create a row
Inside your container you can put as many .row's as you'd like. Rows hold up to a maximum of 12 columns.
Step3. Create your columns
Using the grid classes, create any number of column elements whose class names add up to twelve.
What else should I know?
- Comes with both traditional float-based and flexbox grid systems
- Responsive grid is ready for mobile from the start
- Uses LESS as it's CSS preprocessor
- Comes ready to rock with a local server, watch task, LESS compilation, and JS linting Grunt tasks
- Use as much or as little of the project as you like. No Bootstrap style lock-in here