Member Sign In
Not a member?

A Wired.com user account lets you create, edit and comment on Webmonkey articles. You will also be able to contribute to the Wired How-To Wiki and comment on news stories at Wired.com.


It's fast and free.

Webmonkey is a property of Wired Digital.
processing...
Join Webmonkey

Please send me occasional e-mail updates about new features and special offers from Wired/Webmonkey.
Yes No

Please send occasional e-mail offers from Wired/Webmonkey affiliated web sites and publications, and carefully selected companies.
Yes No

I understand and agree that registration on or use of this site constitutes agreement to Webmonkey's User Agreement and Privacy Policy.
Webmonkey is a property of Wired Digital.
processing...

Retrieve Sign In

Please enter your e-mail address or username below. Your username and password will be sent to the e-mail address you provided us.

or
Webmonkey is a property of Wired Digital.
processing...

Welcome to Webmonkey

A private profile page has been created for you.
As a member of Webmonkey, you can now:
  • edit articles
  • add to the code library
  • design and write a tutorial
  • comment on any Webmonkey article
Close
Webmonkey is a property of Wired Digital.

Sign In Information Sent

An e-mail has been sent to the e-mail address registered in this account.
If you cannot find it in your in-box, please check your bulk or junk folders.
Sign In
Webmonkey is a property of Wired Digital.

Resources for Designing with CSS

Back when I first ditched tables and started using stylesheets and positioned <div> tags to map out page elements, I kept two browser windows open at all times while i was coding. One was a CSS syntax cheatsheet, and the other was Taylor’s Webmonkey tutorial on CSS positioning.

At the time, I would have served thirteen days hard labor for a searchable database of CSS templates. Such databases are easy to find these days, but few have reached the depth and sheer awesomeness of Template:css. Not only does the site provide excellent templates that you can search for based on the number and type of page elements you need, but the code is extremely well-commented.

The next time you’re stuck in a page layout rut, grab one of these templates and tweak it to your liking. Or, if you’ve already designed a page on paper and you need a little guidance, you can open up one of these templates and examine the code. Reading code (and viewing the resultant source) makes an excellent learning tool. There are also some excellent sample templates at Intensivstationthat you can peruse.

Additionally, Max Design has collected a library of CSS template tutorials, complete with sample code for each lesson.

We’ve always said that the easiest way to learn fluid three-collumn layouts is by studying the pros!

[links via digg and google]

Post Comment Comments Permalink Print
Reddit Digg

 
Subscribe now

Special Offer For Webmonkey Users

WIRED magazine:
The first word on how technology is changing our world.

Subscribe for just $10 a year