#020: Finishing the Grid and Setting Up Modules

(Updated on )

Continuing the concept of “Don’t Overthink It Grids”, we get gutters going on in the grid by just using some simple padding. We keep the padding number consistant by reusing our global $padding variable. You’ll find that we use that number a ton as we do our styling.

We style up the “module” class with a simple background and box-shadow. This is a very re-usable class that can be used anywhere.

The end result is a lovely flexible grid which only took a few lines of code. It might get a little bit more complex as we move on, but not too much.