via: http://elliotjaystocks.com/blog/a-better-photoshop-grid-for-responsive-web-design/
example here: http://jsfiddle.net/genelocklin/NFrPC/
| @mixin base { | |
| float: left; | |
| margin-left: 2%; | |
| &:first-child { | |
| margin-left: 0; | |
| } | |
| } | |
| @mixin grid_twelve { | |
| @include base; | |
| width: 6.5%; | |
| } | |
| @mixin grid_six { | |
| @include base; | |
| width: 15%; | |
| } | |
| @mixin grid_four { | |
| @include base; | |
| width: 23.5%; | |
| } | |
| @mixin grid_three { | |
| @include base; | |
| width: 32%; | |
| } | |
| @mixin grid_two { | |
| @include base; | |
| width: 49%; | |
| } | |
| @mixin grid_one { | |
| @include base; | |
| width: 100%; | |
| margin-right: 0; | |
| } |