Learning how to do page layout with CSS and <div>.

[madkidd]

Does anyone know a good resource to learn how to build tableless websites using CSS and <div> tags?

[mwinter]

Does anyone know a good resource to learn how to build tableless websites using CSS and <div> tags?

Well perhaps the first thing is to understand that you don't build tableless sites using div elements. You should aim to use semantic markup. That is, use elements for their proper purpose: lists (ol, ul) for lists; paragraphs (p) for paragraphs; tables for tabular data, and so on.

The div element is a generic block-level element; a container. When you need to group related elements (parts of a document header, for instance) and there are no other appropriate elements for the task, then you should use it. If you find more div elements in a document compared to everything else, then you probably have a problem.

Remember that HTML isn't about presentation. It's about markup - describing content. First you should mark-up the content, adding any extra 'hooks' (like necessary groups div elements) that you anticipate you'll need. Only once that's done should you start adding CSS to alter the presentation.

Mike