TalkPHP - View Single Post

sidisinsane · 02-23-2009, 12:55 PM

I can't really see what exactly you want to achieve, so here are just some very basic tips for creating (tableless) layouts with CSS.

1. Create your (semantic) HTML
2. Plan your layout (on paper)
3. Add styling so that it works in modern browsers (FF, Safari, perhaps Opera)
4. Look how it works in the various IEs and create extra styling for them (i.e. using conditional comments)

But first inform yourself about browser-specific behaviours, especially when you are using floats ("clearing floats") and when you are using paddings ("box model"). There are many more "bugs" or irregularities to name and you'll definitely meet upon several of them.

If you aren't planning on really getting into layouting or you're too lazy to be bothered, then start off with one of the many CSS-Grid-Frameworks (Blueprint, YAML, 960, etc.) or grab a template that meets your needs at CSS Zen Garden i.e.

Last but not least, put up a demo page and post the link if you want help with a layout. Makes things much easier and less time consuming. Hope this doesn't add to your confusion, because its not meant to do so.

02-23-2009, 12:55 PM	#2 (permalink)
sidisinsane The Wanderer Join Date: Jan 2008 Posts: 24 Thanks: 13	I can't really see what exactly you want to achieve, so here are just some very basic tips for creating (tableless) layouts with CSS. 1. Create your (semantic) HTML 2. Plan your layout (on paper) 3. Add styling so that it works in modern browsers (FF, Safari, perhaps Opera) 4. Look how it works in the various IEs and create extra styling for them (i.e. using conditional comments) But first inform yourself about browser-specific behaviours, especially when you are using floats ("clearing floats") and when you are using paddings ("box model"). There are many more "bugs" or irregularities to name and you'll definitely meet upon several of them. If you aren't planning on really getting into layouting or you're too lazy to be bothered, then start off with one of the many CSS-Grid-Frameworks (Blueprint, YAML, 960, etc.) or grab a template that meets your needs at CSS Zen Garden i.e. Last but not least, put up a demo page and post the link if you want help with a layout. Makes things much easier and less time consuming. Hope this doesn't add to your confusion, because its not meant to do so.