about me

I'm a 36'ish year old web application developer from South Portland, Maine. I love meeting fellow techies, drop me a line if you want to talk shop.

Categories

CSS Grid Frameworks: 960gs Without Margins

Posted on 04/01/2009 at 02:24 AM

I’ve been using the Blueprint and 960gs CSS Frameworks for a while now and have had but one complaint: they both assume you want to create your layouts with margins between the columns. Unfortunately, in my own use of these frameworks I’ve found that I work more with inner columns than exterior ones, and the default margin styles were a nuisance then.

So ... I forked Nathan Smith’s 960gs and recalculated the grid styling to remove the column margins. Now when I declare any two columns side by side, they will be flush against each other. Perhaps others will find this useful as well. I left the reset.css and text.css styles as they were.

You can find my code here.

One final note: I’ve been using 960gs a lot more than Blueprint lately because I’ve found Blueprints text styles make too many assumptions on my behalf for how I would like my text to layout. 960gs in comparison is quite minimal.

960 grid without column margins

5 Comments

Comment #1 by Adrian Liem  on  04/27  at  09:42 PM

yes, i face the same problem as well. i’ve tried to remove the margin without changing the source code, but finally i realized that it can’t be done. thanks for the share! God bless

Comment #2 by Dragos  on  06/21  at  09:47 AM

thanks a lot!

Comment #3 by Michael  on  07/23  at  01:34 PM

I came up with a solution that works pretty well for me, that acts as a mod for the GS, so you don’t actually have to edit the 960gs source.

http://www.michaelhartmayer.com/css/960gs-margin-mod

Check it out smile Lemme know if you like it.

Michael

Comment #4 by maks  on  03/04  at  01:33 PM

You can use grid generators (http://www.spry-soft.com/grids for 960gs, the included ruby compress tool for blueprintcss) and specify a zero gutter width...well they allow you to specify total width / grid element width / columns count as well or to generate a customized grid

Comment #5 by Martin J  on  09/01  at  01:18 AM

Thank you so much! I was thinking about doing this myself but thought I should check to see if someone else had done the hard work first!
-Mart

Leave a comment?

Please use Pastie or Gist if you need to write code in your comments.

Name:

Email:

Location:

URL:

Remember my personal information

Notify me of follow-up comments?

Please enter the word you see in the image below:


RailsConf 2008 Often times I will release code for free or go that extra distance to help others online. If my skills were useful to you, please consider a small donation. Thank you very much.

recommend me!

Search

You Can Find Me

@ github.com
@ twitter.com
@ calendaraboutnothing

My Wishlists

@ Amazon.com

My Other Sites

Foundation's Edge, RJones Family, We're Not.com (only for staging), Ailee Jones (same as rjones for now)

Friends of Mine

Aaron, Barnaby, Brian, Chris, Dirk, Frank, Four, Justin, Matt, Mike, Monty, Paul, Sean, Travis

IRC Hangouts

I can usually be found lounging on irc.freenode.net while I work, on the following channels: #fauna, #github, #hello-heroku, #jquery, #passenger, #ruby, #rubyonrails, #slicehost, #sproutcore, #textmate, #werenot.