Obviously this will be a project in it's own right to tackle using DIV tags.
I'm not asking anyone to do this (although would be great ). I'm also fairly new to DIV tags but can easily learn, i understand how they work and can use them but not to this complexity
I'm asking if someone can tell if I'm wasting my time and should re-consider the table but with a better code design (not layout, code design)
This is NOT the way to move from table-less layouts. You are still THINKING tables - rigid boxes each containing a piece to be positioned accurately like a jigsaw puzzle.
The whole point of current web practices is to emphasise CONTENT - first you have content, THEN you style that content to give the visual presentation you require. No content = nothing to style = no layout. This WILL involve thinking differently, where you will be positioning logically-grouped objects such that their relationship to other objects is determined similar to stacking blocks, and their positioning and/or size is allowed to move depending on browser resolution. Gone will be the days of slicing up a photoshop graphic and rigidly reassembling the pieces on the page - there is nothing wrong with laying out a design in Photoshop, just that you will use the individual objects rather than flattening and slicing the overall image.
So first think about the content of the site, then mock up an image of how you might want that content displayed, and then we can help further.
So you want to make that layout as a table, and then put each box inside a div? a lot of people would probably say use CSS... which i would also say.. do you have an example with content?
Scrap the tables and the divs to start with and begin with semantic HTML where the tags identify what the content is. Style that as far as possible to get the effect you want and only add extra divs where absolutely necessary. Using CSs properly can produce layouts that are impossible with tables because you are not restricted to a grid structure and can even overlap elements. Simply set the margins, padding, width, float, and clear attributes for the appropriate elements to position them relative to the preceding elements in your page unless you actually need things to overlap (which can't be done with tables anyway) and then you would need to use position:relative with a nested position:absolute to position one element over another. Build it up one piece at a time and you will find it much easier than trying to create the entire layout in one go.
If it can be done with tables then it can be done with CSS and often doesn't even require any div tags at all. CSS can also produce many layouts that tables can't.
). I'm also fairly new to DIV tags but can easily learn, i understand how they work and can use them but not to this complexity
Reply With Quote
Originally Posted by SeanJenkins
Bookmarks