Micah Githens
Micah Githens

Reputation: 1261

CSS grid generator based on percentages not pixels

I'm looking for a fluid CSS grid generator that's based a percentage width like 100%. Everything I've found so far requires a specified pixel width or min/max pixel width.

These grid generators are all pixel based: http://www.gridsystemgenerator.com/

Upvotes: 1

Views: 4878

Answers (2)

Robin Winslow
Robin Winslow

Reputation: 11502

Foundation has a percentage-based grid system: http://foundation.zurb.com/

Upvotes: 2

bookcasey
bookcasey

Reputation: 40511

If you want to make a grid based on a percentage width, you don't need a generator.

Just count.

If you want a column that is half of the body, make it width:50%;. Quarter? width:25%;

I made a demo for you.

However, making a design entirely depended on percentages to leads to some problems. While a paragraph might look fine with width:50%; on your screen, someone with a huge monitor might see that entire paragraph on one line, which would be obnoxious to read.

I would recommend The 1140 Grid. It's based on pixels, but is also fluid, and may suit your needs. Also, by using max-width everything will remain easy to read for everyone.

Upvotes: 3

Related Questions