E-Mail:

How To Make An Easy CSS Grid Layout

  • 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.

[YUI: CSS Grid Builder]

[tags]css grid, web design[/tags]

3 Comments

That is really neat. Though the 3 column 1 row does not work in IE 6.

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.

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.

What Do You Think?

 
64 queries / 1.288 seconds.