Here are a few examples of how the pre-made 4, 8, or 12 grid columns CSS can be applied.


The Blog
Blog Title .span2of4
Navigation .span2of4
Blog Post .span3of4
Calendar .span1of4
Featured Post 1 .span1of4
Featured Post 2 .span1of4
Featured Post 3 .span1of4
Featured Post 4 .span1of4
Footer .span4of4

The Business Site
Logo .span3of8
Navigation .span5of8
Full-Width Image/Info Slide .span8of8
Newsfeed .span2of8
Services Offered .span4of8
Events .span2of8
Footer .span8of8

The Portfolio
Header .span12of12
Image 1 .span4of12
Image 2 .span4of12
Image 3 .span4of12
Image 4 .span4of12
Image 5 .span4of12
Image 6 .span4of12
Image 7 .span4of12
Image 8 .span4of12
Image 9 .span4of12
About .span6of12
Contact .span6of12
Footer
ABOUT CODE ALIVE

Code Alive is a website designed to help the more visually inclined learners basics of using CSS. The CSS framework was developed by Vi Chetan and forms the basis of the contents of this website. It is inspired by Graham Miller's Responsive Grid System.

CODE VISUALIZER

The Code Visualizer is a simple way of of viewing the 4,8, and 12 column grid CSS based on Code Alive's grid system.

I KNOW IT'S NOT PERFECT...

Since it's my first time developing a framework, any suggestions on ways to improve the framework will be great! Please let me know if problems are found in the code. I would love to learn from whoever I can, however I can!