Get our new Windows 7 eBook (PDF) for $7 with 70+ Tips. Download Now!
How To Make An Easy CSS Grid Layout
- 5
- Add a Comment
- No Related Post
Yahoo! has released a nice tool to help make easy CSS grid layouts with its YUI: CSS Grid Builder.
Use it to make your columns, set their widths, and add places for your header and and footer content. The tool then creates the code and allows you to copy it.
Yahoo! has tested these designs in all Web browsers to ensure maximum browser compatibility and a headache free design experience.
[tags]css grid, web design[/tags]

5 Comments
Cube Dweller
September 27th, 2007
at 1:57pm
That is really neat. Though the 3 column 1 row does not work in IE 6.
Pete
September 28th, 2007
at 2:03am
Yes this is a neat tool.
Works for me in IE6, 3 columns 1 row or any combination provided.
Using the scroll wheel you can cycle through the available layouts.
Actually I had fun with it stretching it across 2 monitors and it picks up
the dimensions just fine.
Rainer
January 8th, 2008
at 9:49am
It’s a nice tool, but imho the classes used in the layers are too confusing. I prefer to name my layers “speaking”. Anyway, if you don’t know how to make a css grid - the YUI is fantastic.
ding
September 5th, 2009
at 10:44am
This website is horribly slow. And I am not talking about the server. I am talking about how the html is build up. When scrolling this page in my browser, it’s really slow and lags a lot.
I don’t know what is going on with the way this page is coded, but you should fix it.
Perhaps you don’t notice on fast computers.
This is bad html/css/java/whatever you use.
usrbingeek
September 5th, 2009
at 11:56am
I agree Ding. I’ve forwarded your comments to Lockergnome’s owner.