Table of Contents

Grid

Below is the HTML and CSS for a grid system that is designed based on the alerts of the Bootstrap HTML framework and theming system.

Grids in a Section

There are 2 <div class="row"> elements of equal size and number components directly below this sentence.

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

Grids in an Invisible Section

The following section is "invisible".

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

Grid for Sections

Below is an example of the grid system being used for laying out <section> elements.

section

section

section

section

Special Thanks

This page is comprised of my own additions and either partially or heavily modified elements from the following source(s):

Grids in an Invisible Section at the Bottom of a Page

The last "invisible" section is intentionally left at the bottom of the page to ensure proper spacing between grid cells and the logo footer.

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div

div