CSS vs Tables

..oO(Thierry | www.TJKDesign.com)

Michael Fesser wrote:

IMHO tables are a layout tool by definition. They are just one way to
present a bunch of data. A list would be another for example.

Tables were not meant for layout, but to display tabular data.

And what makes data tabular? The presentation, the layout. I could also
use lists or diagrams to present the same data.

That's why
the "purists" say they are hacks when used for layout.

A table _is_ a layout, the only question is how one defines "data".

Anyway, I think we're talking "page layout"; so I wouldn't put lists in the
same category as tables.

<ul>
<li>heading</li>
<li>navigation</li>
<li>content</li>
</ul>



Micha

On Fri, 04 Nov 2005 19:31:14 +0100, Michael Fesser <netizen (AT) gmx (DOT) de>
wrote:

There are more ways than just tables or "CSS-P". It's not just black and
white.

YES! Don't forget chartreuse and champaign! ;-)

Gary

Michael Fesser wrote:

IMHO tables are a layout tool by definition. They are just one way
to present a bunch of data. A list would be another for example.

Tables were not meant for layout, but to display tabular data.

And what makes data tabular? The presentation, the layout. I could
also use lists or diagrams to present the same data.

That's exactly why I mentionned earlier that there was a serious difference
between tables used for layout and tables used for tabular data.
In an *accessible* table, there is a logical relationship between rows and
columns that can make sense without visual representation. IMHO, one cannot
achieve this using lists.

That's why
the "purists" say they are hacks when used for layout.

A table _is_ a layout, the only question is how one defines "data".

You're talking *visual* layout. I'm not. IMO, HTML markup should help all
UAs to make sense of a document, not to make it looks good in "some" of
them.

Anyway, I think we're talking "page layout"; so I wouldn't put lists
in the same category as tables.

ul
li>heading</li
li>navigation</li
li>content</li
/ul

Shame on you

--
Thierry | http://www.TJKDesign.com | CSS-P Templates + Articles:
CSS Popups, CSS 3 Column Layout, CSS Tabs, CSS Dropdown Menu,
TIP Method, Sliced Images, Clean Popup Windows, Easy Maintenance.....

James Shook wrote:

Thierry | www.TJKDesign.com wrote:

One think we know *for sure* is that tables were *not meant* for
layout

Do we?

A blast from the past:
http://www.barry.pearson.name/articles/layout_tables/history.htm

The logic is to believe that, at the time, displaying tabular data was a
bigger issue than the "look and feel" of a web page.


--
Thierry | http://www.TJKDesign.com | CSS-P Templates + Articles:
CSS Popups, CSS 3 Column Layout, CSS Tabs, CSS Dropdown Menu,
TIP Method, Sliced Images, Clean Popup Windows, Easy Maintenance.....

Roby wrote:

About those DIVs,
is it the same if I create them using the layers tool in DW?

"Layers" rely on "position:absolute", you want to stay away from that to
achieve page layout.

--
Thierry | http://www.TJKDesign.com | CSS-P Templates + Articles:
CSS Popups, CSS 3 Column Layout, CSS Tabs, CSS Dropdown Menu,
TIP Method, Sliced Images, Clean Popup Windows, Easy Maintenance.....

"Murray *TMM*" <forums (AT) HAHAgreat-web-sights (DOT) com> wrote

I seem to remember Al saying that 'float' was never meant to be used
to place two <divs> side-by-side. However I have no idea what its
original intended purpose was.

I did say that. The float property was originally purposed to replace
the align attribute. Using it for columnar layout is no less a hack than
using tables for layout.

I definitely don't remember him saying this. One could also say that
float was not intended to make list items line up horizontally, but he
does that.

Yes. And I also use tables sometimes, too. Whatever is the most logical
and stable road is where youse'll find me :-)

I don't think one can *know* what float was intended to do, other than
to allow adjacent content to flow around the element as an island in a
river.

Like setting the align attribute on an image or table used to work :-)


--
Al Sparber
PVII
http://www.projectseven.com

"Designing with CSS is sometimes like barreling down a crumbling
mountain road at 90 miles per hour secure in the knowledge that repairs
are scheduled for next Tuesday".

"James Shook" <jshook (AT) dont_mail (DOT) com> wrote

Thierry | www.TJKDesign.com wrote:

One think we know *for sure* is that tables were *not meant* for
layout


Do we?

A blast from the past:
http://www.barry.pearson.name/articles/layout_tables/history.htm

Barry is a very smart man and put a lot of work into that.


--
Al Sparber
PVII
http://www.projectseven.com

"Designing with CSS is sometimes like barreling down a crumbling
mountain road at 90 miles per hour secure in the knowledge that repairs
are scheduled for next Tuesday".

I wish he was still posting here. I have tried several times to correspond
with him but to no avail. I fear the worst....

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"Al Sparber- PVII" <hiding (AT) nospam (DOT) net> wrote

"James Shook" <jshook (AT) dont_mail (DOT) com> wrote in message
news:dkgelj$5di$1 (AT) forums (DOT) macromedia.com...
Thierry | www.TJKDesign.com wrote:

One think we know *for sure* is that tables were *not meant* for layout


Do we?

A blast from the past:
http://www.barry.pearson.name/articles/layout_tables/history.htm

Barry is a very smart man and put a lot of work into that.


--
Al Sparber
PVII
http://www.projectseven.com

"Designing with CSS is sometimes like barreling down a crumbling mountain
road at 90 miles per hour secure in the knowledge that repairs are
scheduled for next Tuesday".

and stable road is where youse'll find me :-)

Spoken like a true Noo Yawker....

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"Al Sparber- PVII" <hiding (AT) nospam (DOT) net> wrote

"Murray *TMM*" <forums (AT) HAHAgreat-web-sights (DOT) com> wrote in message
news:dkg0l6$fm4$1 (AT) forums (DOT) macromedia.com...
I seem to remember Al saying that 'float' was never meant to be used to
place two <divs> side-by-side. However I have no idea what its original
intended purpose was.


I did say that. The float property was originally purposed to replace the
align attribute. Using it for columnar layout is no less a hack than using
tables for layout.

I definitely don't remember him saying this. One could also say that
float was not intended to make list items line up horizontally, but he
does that.

Yes. And I also use tables sometimes, too. Whatever is the most logical
and stable road is where youse'll find me :-)


I don't think one can *know* what float was intended to do, other than to
allow adjacent content to flow around the element as an island in a
river.

Like setting the align attribute on an image or table used to work :-)


--
Al Sparber
PVII
http://www.projectseven.com

"Designing with CSS is sometimes like barreling down a crumbling mountain
road at 90 miles per hour secure in the knowledge that repairs are
scheduled for next Tuesday".

Here is a hack-free and more logical way to do multi-column layouts:

Markup:

<div id="mainlayout">
<column id="c1">
Column 2: main content
</column>
<column id="c2">
Column 1: left sidebar
</column>
<row id="wideheading">
A wide heading that spans all columns
</row>
<column id="c3">
Column 3: right sidebar
</column>
</div>

The CSS:

#mainlayout {
width: 98%;
min-width: 620px;
max-width: 1000px;
display-columns: c2, c1, c3;
column-gutter: 20px;
}

#c2, #c3 {
width: 160px;
}

#wideheading {
column-span: c1, c2, c3;
}


Works perfectly in a logical place far, far, away...


--
Al Sparber
PVII
http://www.projectseven.com

"Designing with CSS is sometimes like barreling down a crumbling
mountain road at 90 miles per hour secure in the knowledge that repairs
are scheduled for next Tuesday".



"Murray *TMM*" <forums (AT) HAHAgreat-web-sights (DOT) com> wrote

and stable road is where youse'll find me :-)

Spoken like a true Noo Yawker....

--
Murray --- ICQ 71997575
Team Macromedia Volunteer for Dreamweaver
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com - Template Triage!
http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs, Tutorials & Resources
http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
==================


"Al Sparber- PVII" <hiding (AT) nospam (DOT) net> wrote in message
news:dknss9$cgl$1 (AT) forums (DOT) macromedia.com...
"Murray *TMM*" <forums (AT) HAHAgreat-web-sights (DOT) com> wrote in message
news:dkg0l6$fm4$1 (AT) forums (DOT) macromedia.com...
I seem to remember Al saying that 'float' was never meant to be
used to place two <divs> side-by-side. However I have no idea what
its original intended purpose was.


I did say that. The float property was originally purposed to replace
the align attribute. Using it for columnar layout is no less a hack
than using tables for layout.

I definitely don't remember him saying this. One could also say
that float was not intended to make list items line up horizontally,
but he does that.

Yes. And I also use tables sometimes, too. Whatever is the most
logical and stable road is where youse'll find me :-)


I don't think one can *know* what float was intended to do, other
than to allow adjacent content to flow around the element as an
island in a river.

Like setting the align attribute on an image or table used to work
:-)


--
Al Sparber
PVII
http://www.projectseven.com

"Designing with CSS is sometimes like barreling down a crumbling
mountain road at 90 miles per hour secure in the knowledge that
repairs are scheduled for next Tuesday".