960 Grid isnt really 960 with the 10px margins in the way. more like 940px? [#1278312]

960 grid isnt really 960 since the margins on the left and right are 10px that take away from that. so its really a 940 grid system.... unless im not looking on where to adjust these margins. I mean i can easily override the class, but maybe there's a reasoning for this?

Im stuck right now since the design files are made in a 960px wide grid, but omega only gives me 940px to play with. =( What to do? to override or not to?

thanks!

Comments

Comment #1

patoshi CreditAttribution: patoshi commented 14 September 2011 at 15:02

Status:

Active

» Fixed

nevermind 960gs is how its made.. it is suppose to be 940px.. there is no magic switch to remove those margins. will just have to modify it to be a 980 grid to make this all fit!

Comment #2

himerus CreditAttribution: himerus commented 14 September 2011 at 15:09

If you aren't familiar with the 960 grid (http://960.gs/) it DOES come with a download package that has all sorts of handy templates for photoshop, illustrator, pdf, etc. etc. etc. that give you the proper layout for the columns in the grid layout...

This is a solid system, and why the fluid, 1200px and 720px grids now in Omega 3.x were designed using the same principals using the grid generator that Nathan links to off of his main site.

If you didn't/weren't aware of the photoshop templates available for 960 grid, then how did you determine the width of elements inside the 960 pixels you used to fill up with your design??

There are tons of great articles on the basics of the 960.gs that are way outside the scope of omega documentation or support.

Sorry you had a "bad time" figuring out how the dimensions of the 960 grid actually work... I've been speaking on this topic (as have others) since well before DrupalCon Paris a few years back now that was when 960 grid was the hot topic.

Comment #3

JSCSJSCS CreditAttribution: JSCSJSCS commented 14 September 2011 at 16:34

duckx,

You adjust the margins in a 960 grid framework to remove the left and/or right margin space by adding .alpha or .omega to the class of the object you want to shift. For nested DIV's, I think you need only add it to the first AND last nested DIV.

Comment #4

patoshi CreditAttribution: patoshi commented 16 September 2011 at 16:56

thanks all.. i just went ahead and made it a 980 grid! =P shot: http://prntscr.com/32irj

it was mainly the designers fault since she didnt use any grid layout and just designed it in a 960px width file. either way on the next project that involves 960, i'll make sure the designer is using a 960 template.