so on 960:s homepage you can customize the grid and download the fluid version. so if i want a flexible grid this will do?
what's the thing about fluid 960 grid system? there are only 12 and 16 column versions. what if i have generated a 24 columns fluid version with 960 custom generator?
you can try fluid24 it is a fluid 24 columns grid system based on 960.gs
The custom CSS generator helps you use the same concept behind 960 but with other variables, and a fluid version as well. It was developed by Spry Soft and was based on 960.gs.
You can customize width, number of columns, and if you want a fluid layout using that generator. You might want to start with a simple site using just 960gs to get the hang of it before trying a 24 column fluid width layout.
Related
I am quite new to web grid systems but would like to choose SUSY mainly because so many people recommend it. What I'd like to achieve is something similar to what I see with the grid system in Twitter bootstrap, where the columns are not fluid in width, but the entire grid width has two or three pre-defined widths based on available resolution.
So, for example, I'd like to have an 8 column grid, with a grid width of 1140px if available, else 960px.
I was able to come up with something similar with SUSY, where my max container width was 1140px, and by setting a min-width of 960px it would never resize below that, but the grid was fluid between the two and my preference is for it to simple switch from one to the other when the resolution becomes available. This is mainly to have 2 or 3 predictable layouts.
Many thanks if anyone can help.
Chris Chandler
You want to use Susy's static output. To do that, set $container-style: static;. See the docs on the official Susy site.
For the fluid layouts, can i use 960 grid system for developing web applications..?
You can use the 960 grid system for web applications. If you want a fluid version you must select the fluid version to download. The default version is based on a fixed width of 960 pixels. See the download page:
http://www.spry-soft.com/grids/
Yes. Go to http://grids.heroku.com/ and download the fluid version instead of the normal version.
I personally like the 960.gs layout and think it looks good on any browser/system except mobile, then you should have a mobile version (jQueryMobile, Sencha etc).
Anyhow if you want something a little larger than 960 there is a new grid system that works quite well called 1140
http://cssgrid.net/
Check out their site. I found 1140 easier to use than 960.gs, in fact I wish they supported 960px resolution :)
Hope this helps!
is there a way of having at least 24 columns using Fluid 960 Grid System?
http://www.designinfluences.com/fluid960gs/
cause i want a fluid version and im currently using the fluid version you can download with css generator on 960:s website.
give a try to fluid24.org it is based on 960.gs but allows you a fluid/liquid layout
You just need to do the math 960/24 = 40 so yes but you might need to work out the css yourself though - I am not familiar with this css library. If you know how the fluid grid system works. My favourite article on the subject is by Jon Tan and this should tell you everything you need to know: http://jontangerine.com/log/2007/09/the-incredible-em-and-elastic-layouts-with-css
Difference between grid and liquid layouts? Looking for explanation of a grid layout.thanks
Grid layouts are built more towards a specific width no matter how wide a user's browser window is.
Liquid layouts expand/contract based on the width of the user's browser window.
Grid layouts are frameworks that work by using columns and rows of fixed size. You have to decide on the width you want the page to be and use a relatively complex range of classes to create basically a table layout. Check out one of the most popular ones:
http://960.gs/
There are already a number of pointers to good grid layout systems in other answers, I like Yahoo's UI Grids a lot. It can do fixed-width layouts and 100% (fluid) layouts, and there's a nice tool that allows you to play with different layouts.
Fixed-width layouts have the advantage of being more predictable than fluid layouts in many cases.
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
http://www.gridsystemgenerator.com/
This will generate the CSS based on the values defined in the form.
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
The 960 generator ?
You could also use http://www.960.gs. There are a number of online options to create a grid system. Its pretty simple!
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.