How to use Blueprint CSS grid framework custom widths and gutters?

37 views
Skip to first unread message

Jitendra

unread,
Oct 29, 2009, 1:00:19 AM10/29/09
to Blueprint CSS
How to use Blueprint CSS grid framework custom widths and gutters? In
my company i get design (PSD) in different sizes in width site like
900px, 920 px, 915px, 973 px etc. and different gutter sizes like 10
px on right, 20 px on left etc. in this type of condition how can i
use and take benefir of grid based framework

Goulven CHAMPENOIS

unread,
Oct 29, 2009, 3:17:24 AM10/29/09
to bluepr...@googlegroups.com
1. Get to talk with the designers, show them the advantages of grid-based design: better harmony, easier placement, of new elements, etc. Be sure to showcase some visual examples to appeal to their aesthetic sense.
2. If the design almost fits on a grid but for a few pixels here and there, ask the designer if he would object to your aligning things to the grid.
3. Generate custom grids using http://bluecalc.groupion.com/ or http://blueprint-generator.kaizeku.com/ and place items on the grid, adding a pixel here and there when you have to keep the irregularities.
--
Goulven Champenois

Noel

unread,
Oct 29, 2009, 9:14:26 AM10/29/09
to bluepr...@googlegroups.com
Chech out Compass. It supports Blueprint and allows for more dynamic
settings.

Sent from my iPhone

Jesse Sutherland

unread,
Oct 29, 2009, 10:09:05 AM10/29/09
to Blueprint CSS
I gotta go with Goulven on this one. As a web designer you should be
calling the shots on how the design - at least small details like
gutter width etc - fits your work. This is a battle I've fought many
times over the years and I've gone from being very (too) accommodating
to the designers to just rejecting any improperly formatted PSD. The
fact is that ultimately the PSD's don't count for anything. You're
the one who's going to bring them to life on the web, and the web
isn't as malleable or customizable as a lot of designers seem to
think. I recommend you try to foster a culture of standards in your
workplace. Many designers are great with aesthetics but simply don't
understand the web and the technologies that you need to use to make a
site work. This is not really their fault - they were trained to do
Photoshop and color theory etc - and of course everyone can't know
everything. So, long story short, make the design fit your grid, not
the other way around and try to educate the designers a little bit
(you don't have to go all standardista apeshit ) about the issues and
at the very least get them to start using a standard grid. There are
all sorts of tools/plugins they and you can use in Photoshop and in
Firefox (firebug of course, and the great addition : Pixel Perfect -
https://addons.mozilla.org/en-US/firefox/addon/7943) that will make
your lives easier and allow you to get on the same page. This is a
super important issue and I'm glad you brought it up! Best of luck
Jitendra

On Oct 29, 9:14 am, Noel <wwydi...@gmail.com> wrote:
> Chech out Compass. It supports   Blueprint and allows for more dynamic  
> settings.
>
> Sent from my iPhone
>
Reply all
Reply to author
Forward
0 new messages