Evo does not require usage of any particular grid system. Evo features a rudimentary classes for layout and positioning, for which you can use if you have your own grid system. Try
six-up classes for a simple responsive page layout option.
12 Column Grid
- Half Viewport
- Full Viewport
- FPO Code Block
Bootstrap Grid Layouts
UsageTo use the grid, grab the code or simply connect to the style sheet.
<link rel="stylesheet" href="../css/bootstrap-grid-only.css">
Be sure to follow the Bootstrap convention correctly by at least nesting a
col-xs-12 inside a
row, and place the row inside a
container as follows.
<div class="container"> <div class="row"> <div class="col-xs-12"> <!-- your content here --> </div><!-- /.col --> </div><!-- /.row --> </div><!-- /.container -->
To allow elements to stretch the full-width of the screen, place them outside the
container. Or, use
container-fluid which stretches nearly to the edges of the screen. Use multiple containers in the page if necessary, but avoid nesting them.
A foundation version of the grid is available from here.
- 1 Column Grid
- 2 Column Grid
- Alt 2 Column Grid
- Alt 2 Column Grid Flipped
- Alt Right 2 Column Grid
- 3 Column Grid
- 4 Column Grid