ShaunSpringer

// Responsive layouts in stylus
// https://gist.github.com/1549029
// Created by Benjamin Lupton
// Licensed under the Creative Commons Zero - http://creativecommons.org/publicdomain/zero/1.0/

// ====================================
// Imports

// Nib
@import 'nib'

ShaunSpringer

// Based on getskeleton.com

@import "nib/clearfix"
@import "nib/reset"

global-reset()

columns = 16
column-width = 57px // Ends up as 1232px layout
gutter-width = 20px

ShaunSpringer

Responsive layouts in stylus

Why this way?

1. There is no span1..15 styles, instead your css defines your layout and your html remains semantic and not polluted with display information. As it should be.

2. The markup is incredibly easy, you specify the wrappers width, and then each columns width in percentages. Every other grid framework I've found is incredibly complicated with this.

3. It allows you to have the exact same markup, and completely different styles for different devices, resolutions, stylesheets, whatever. As it should be.

ShaunSpringer

{
{I have|I've} been {surfing|browsing} online more than {three|3|2|4} hours today, yet I never found any interesting article like yours. {It's|It
is} pretty worth enough for me. {In my opinion|Personally|In my view}, if all {webmasters|site owners|website owners|web owners} and bloggers made good content as
you did, the {internet|net|web} will be {much more|a lot more}
useful than ever before.|
I {couldn't|could not} {resist|refrain from} commenting. {Very well|Perfectly|Well|Exceptionally well} written!|
{I will|I'll} {right away|immediately} {take hold of|grab|clutch|grasp|seize|snatch}
your {rss|rss feed} as I {can not|can't} {in finding|find|to find} your {email|e-mail} subscription {link|hyperlink} or {newsletter|e-newsletter} service. Do {you have|you've} any?
{Please|Kindly} {allow|permit|let} me {realize|recognize|understand|recognise|know} {so that|in order that} I {may just|may|could} subscribe.
Thanks.|