thallada.github.io

##Layout & CSS## I use a grid system devised by Adam Kaplan and with some pieces from Jorden Lev. It is set-up by scratch in my main.css. I decided on this so that I would not have to load a huge framework like Bootstrap since I would only be using the grid system out of it.

As an introduction to this system:

1. Wrap everything in a div element with the container class.

'''html

'''

2. To create rows add div elements with the row and clearfix classes.

'''html

'''

2. To create columns add div elements with the column class. Then add a class to describe the width of the column with respect to the container. The possible widths are:

• full: 100% width
• two-thirds: 66.7% width
• half: 50% width
• third: 33.3% width
• fourth: 25% width
• three-fourths: 75% width

These are purely for convienence. A more precise width can be specified in the CSS if desired with the width attribute.

'''html

'''

3. Columns stack up right to left. To force a column out of order all the way to the right use the flow-opposite class on the column.

'''html

'''

4. To hide an element on mobile phones add the class hide-mobile. To hide on desktop, use hide-desktop instead.

'''html

'''

5. Another note: I use box-sizing (as suggested by Paul Irish), which I think makes dealing with sizing elements a lot more sane.