Forum Moderators: open
while surfing on the new design of a Major french newspaper, i tried looking at the code and Surprise:
No <tables><tr><td>.... Only Divs! positioned and styled with CSS/javascript
Has anyone came across such a design pattern, i mean this is not some experimental website, this is mainstream.
what would be the pros and cons of bulding complex webpages/templates using Only DIV as a "block" element?
[edited by: BlobFisk at 2:40 pm (utc) on May 5, 2006]
[edit reason] Link removed! [/edit]
I am sure there are lots of designers on WebmasterWorld who use only divs, including myself. Tables should not really be used for structuring a site, and only used to display tabular data like rows & columns of figures.
There are lots of pro's for using divs including,
The cons are it is a bit more tricky to structure a site using divs, but apart from that there are none.
I am sure others will add more comment.
Pardon me if this sounds too obvious, i come more from a server side environment, i was aware of these techniques but didn't know it had moved to mainstream web design.
Is there some sort of a CSS Library/Framework that mimics the main behaviours of Table based layouts to help people shift away from the old way of doing things?
To start off at least. Personally I find CSS layout a lot easier than tables.
It is easier, but a bit more difficult to make a site which will work in every browser.
What about differences in browser's CSS interpretation?
isn't it harder to build this kind of pages for non Coders? i mean people used to WYSIWYG environments (most designers actually)Pardon me if this sounds too obvious, i come more from a server side environment, i was aware of these techniques but didn't know it had moved to mainstream web design.
Is there some sort of a CSS Library/Framework that mimics the main behaviours of Table based layouts to help people shift away from the old way of doing things?
Most sites handle css very well, just not Internet Explorer sometimes..
In my opinion it is easier to code divs. Take a table, 1 column, 1 row for instance:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
</table> Using div's all you need to do is:
<div> </div> If you are keen to learn css/div's then w3schools [w3schools.com] is a great place to begin.
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
</tr>
</table>Using div's all you need to do is:
<div> </div>
True but you need a <div> </div> for every single cell, and you need to recreate the confortable structuring/positionning offered by <table><tr> through css... so i'm wondering how it can be considered "Easier" to build complex layouts without tables...
True but you need a <div> </div> for every single cell
uh
ou need to recreate the confortable structuring/positionning offered by <table><tr> through css.
Hold up there a moment. If you go into CSS layout thinking that you can carry on using the same style of layout as tables then you'll have problems. CSS layout doesn't work like table based layout (unless you use display:table etc, but then IE doesn't support that) and you'll have problems if you try to replicate it.
Instead of looking at a design and mentally splitting it into rows and cells you need to re-educate your brain into mentally splitting it up into blocks of content, and then sub splitting into semantic chunks ("this is a header, this is a list, this is...). Only once you've built the page in plain semantic HTML should you go back to the design (or at least that's the ideal :) ).
Yes, I know I can div this and div that all I like, but getting those divs to be where I want them in every browser is a PITA.
I am using more CSS these days, but always CONTSTRAINT with with either:
An over riding CSS wrapper (that sometimes fails)
or
A simple TABLE (that never fails).
I know we have the Semantics Bunch. I know we have the Layout Bunch.
Why can't we have both?
(Still working on it!)