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

Question

How to make custom CSS grid framework for custom widths? 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

Answer 1

Everybody seems to have missed the point: if your gutters are not regular, then you can't use a grid system. You just create custom classes for each column and use them as needed. The grid systems use regular gutters so you can stack them (the columns) in a any order you like.

-- Jason

Answer 2

http://www.gridsystemgenerator.com/

This will generate the CSS based on the values defined in the form.

Answer 3

The 960 generator ?

Answer 4

You could also use http://www.960.gs. There are a number of online options to create a grid system. Its pretty simple!

Answer 5

If your widths and gutters are arbitrary sizes, you can't use one grid system for them all.

To create a different grid system for each design, there needs to be a common divisor between the widths - which is what the link provided by dr.squid does - but with widths such as 973, you'll struggle.