Table of contents for SASS Gridification
- SASS Gridification - Part 1
- SASS Gridification - Part 2: Blueprint
- SASS Blueprint Grid on Github
I started a github project for those of you following the SASS Blueprint Grid.
Thursday, June 5, 2008
BlogMarks
Furl
Newsvine
Rojo
Email This to a Friend
If you like this then please subscribe to the Tuesday, May 20, 2008
Table of contents for SASS Gridification
- SASS Gridification - Part 1
- SASS Gridification - Part 2: Blueprint
- SASS Blueprint Grid on Github
I have extended my initial SASS grid to work with the Blueprint grid library. Now I can leverage the Blueprint grid in a completely SASSy way.
Please refer to Blueprint CSS for instructions and tutorials on how to use the grid.
Feel free to download, use, distribute and modify my work as you like.
download: SASS Gridification: Blueprint (3.32KB)
added: 05/20/2008
downloaded: 188 times
description: An adaptation of Blueprint 0.7 Grid in SASS. Change any one of three constants to recalculate the grid.
Saturday, April 26, 2008
Table of contents for SASS Gridification
- SASS Gridification - Part 1
- SASS Gridification - Part 2: Blueprint
- SASS Blueprint Grid on Github
A common problem faced by many CSS developers is the grid layout. In this example I will be using SASS arithmetic to create grid calculations.
If you just want to see the end result, here are two beautiful 8-column grids generated entirely using SASS arithmetic:
Fixed: 8 columns 100px wide with 10px margins
Fluid: 8 columns 12% wide with 0.5% margins
Also, if you haven’t the foggiest notion what SASS is (”… now there’s a frood who really knows where his towel is.”) you should probably read up on Hampton Catlin’s site about HAML and SASS.
To start things off, I looked around the net for what was already available on the subject. I already knew about Blueprint, though I had never really worked with it, and I learned about the YUI CSS grids toolkit.
Both of these CSS frameworks are very powerful. Personally, I don’t need that much power for this proof of concept, and it probably would have taken more time to adapt one of the frameworks into SASS than it would to program something from the ground up. So instead I just whipped out my text editor and started hacking.