Multi Column Text Without Tables
Multi Column Text Without Tables
am 11.07.2007 01:49:53 von Cibressus
I have read (Learning XML - O'Reilly Publishing, 2001), in which, it
is stated that you should not use tables to format text. I understand
this is because it separates data from formating, which can lead to
adverse effects such as not being rendered properly on speech only
browsers.
If I should not use tables to split text into multiple columns, what
should I use? What should I use if I need more flexibility?
Re: Multi Column Text Without Tables
am 11.07.2007 02:18:22 von Nik Coughlin
Cibressus wrote:
> I have read (Learning XML - O'Reilly Publishing, 2001), in which, it
> is stated that you should not use tables to format text. I understand
> this is because it separates data from formating, which can lead to
> adverse effects such as not being rendered properly on speech only
> browsers.
>
> If I should not use tables to split text into multiple columns, what
> should I use? What should I use if I need more flexibility?
http://www.google.com/search?q=3+column+layout
Re: Multi Column Text Without Tables
am 11.07.2007 13:56:09 von Brian Cryer
"Cibressus" wrote in message
news:1184111393.848364.297320@22g2000hsm.googlegroups.com...
>I have read (Learning XML - O'Reilly Publishing, 2001), in which, it
> is stated that you should not use tables to format text. I understand
> this is because it separates data from formating, which can lead to
> adverse effects such as not being rendered properly on speech only
> browsers.
>
> If I should not use tables to split text into multiple columns, what
> should I use? What should I use if I need more flexibility?
The gist of it is to format each of your columns individually and then float
one column against the next. So something like:
Left column
Body
In practise you'll probably want to apply those styles to divs and move the
style defs into a separate style sheet. There are limitations and you'll no
doubt find issues, but that's the general gist of it.
To be honest though, and whilst I do mostly use this technique, there are
still times when using a table for part of the layout is just so much
easier.
Hope this helps.
--
Brian Cryer
www.cryer.co.uk/brian
Re: Multi Column Text Without Tables
am 11.07.2007 13:59:49 von dorayme
In article ,
"Brian Cryer" wrote:
> To be honest though, and whilst I do mostly use this technique, there are
> still times when using a table for part of the layout is just so much
> easier.
Meaning, I assume, that the basic skeleton be a table with 3
cols. If you do only this and from there on do not use tables for
layout, within the columns, it is no big crime and has much to
recommend it in actual practice.
--
dorayme
Re: Multi Column Text Without Tables
am 11.07.2007 14:17:40 von lws4art
Brian Cryer wrote:
> Left column
^^^
20 what?. A little correction here is that a length in this application
unless 0 needs the units specified. "width: 20em;"
--
Take care,
Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
Re: Multi Column Text Without Tables
am 11.07.2007 14:27:47 von marss
Cibressus wrote:
> If I should not use tables to split text into multiple columns, what
> should I use? What should I use if I need more flexibility?
Multi-columns layout by means of div no more than guru's freak. If you
want columns then use an element that has columns.
You can eat a soup using fork but spoon is more handy. :) IMHO.
Mykola
http://marss.co.ua
Re: Multi Column Text Without Tables
am 11.07.2007 16:51:04 von Brian Cryer
"Jonathan N. Little" wrote in message
news:222c8$4694ca74$40cba7cb$22337@NAXS.COM...
> Brian Cryer wrote:
>
>
>> Left column
> ^^^
> 20 what?. A little correction here is that a length in this application
> unless 0 needs the units specified. "width: 20em;"
Oops. Well spotted. I meant 20%, but 20em would be just as good - just not
20px.
--
Brian Cryer
www.cryer.co.uk/brian
Re: Multi Column Text Without Tables
am 11.07.2007 16:57:02 von Brian Cryer
"dorayme" wrote in message
news:doraymeRidThis-B34A6E.21594911072007@news-vip.optusnet. com.au...
> In article ,
> "Brian Cryer" wrote:
>
>> To be honest though, and whilst I do mostly use this technique, there are
>> still times when using a table for part of the layout is just so much
>> easier.
>
> Meaning, I assume, that the basic skeleton be a table with 3
> cols. If you do only this and from there on do not use tables for
> layout, within the columns, it is no big crime and has much to
> recommend it in actual practice.
I still have some pages on my website that use a two column table for laying
out the entire page. The disadvantage of using a table for controlling the
page layout is that the browser won't render anything until it has read to
the end of the table. This means that where the table is used to control the
page layout that it won't render anything until it reads to the end of the
page. So performance wise, its not a good idea. That said, I've not done
empirical testing with Mozilla or IE 7 so there is scope for browsers being
more intelligent and rendering sooner than they used to be.
Whatever, I do agree that using tables is "no big crime and has much to
recommend it in actual practice."
Where I tend to use tables occasionally for layout now is where I want a few
items lined up (for example in a 2 x 2 grid), and its just so easy in a
table.
--
Brian Cryer
www.cryer.co.uk/brian
Re: Multi Column Text Without Tables
am 11.07.2007 20:27:21 von Neredbojias
Well bust mah britches and call me cheeky, on Wed, 11 Jul 2007 12:27:47 GMT
marss scribed:
>> If I should not use tables to split text into multiple columns, what
>> should I use? What should I use if I need more flexibility?
>
> Multi-columns layout by means of div no more than guru's freak.
Hardly. It is the standard. Don't denigrate the standard because you
don't know it.
--
Neredbojias
A self-made man who worships his creator
Re: Multi Column Text Without Tables
am 11.07.2007 21:16:56 von Adrienne Boswell
Gazing into my crystal ball I observed marss writing
in news:1184156867.229717.251110@w3g2000hsg.googlegroups.com:
> You can eat a soup using fork but spoon is more handy.
I like that analogy.
--
Adrienne Boswell at Home
Arbpen Web Site Design Services
http://www.cavalcade-of-coding.info
Please respond to the group so others can share
Re: Multi Column Text Without Tables
am 11.07.2007 22:52:14 von Nik Coughlin
marss wrote:
> Cibressus wrote:
>
>> If I should not use tables to split text into multiple columns, what
>> should I use? What should I use if I need more flexibility?
>
> Multi-columns layout by means of div no more than guru's freak. If you
> want columns then use an element that has columns.
> You can eat a soup using fork but spoon is more handy. :) IMHO.
It's really, really easy to do columns without tables. Now, equal height
columns on the other hand... can't be done without tables. Or css tables,
but without IE support those are useless.
Re: Multi Column Text Without Tables
am 11.07.2007 23:37:27 von dorayme
In article ,
Adrienne Boswell wrote:
> Gazing into my crystal ball I observed marss writing
> in news:1184156867.229717.251110@w3g2000hsg.googlegroups.com:
>
> > You can eat a soup using fork but spoon is more handy.
>
> I like that analogy.
Not as apt as if he had used casserole. You can't eat soup with a
fork. You can layout columns without a table. The truth is that
it takes quite some skill and thought and fiddling about to get
more than 2 col layouts to do all the things that the modern
author can reasonably expect. 2 col layouts are generally a cinch
with a float for left or right and so there is little reason in
this case to begin such a layout with a table.
Nearly all meals that do not require any cutting, are more
sensibly eaten with a spoon rather than a knife and fork. It
never ceases to amaze me that people even eat casseroles with a
fork and I have seen folk actually cutting mainly the plate in a
conditioned-response sort of a way when there is nothing that
_needs_ cutting.
--
dorayme
Re: Multi Column Text Without Tables
am 12.07.2007 01:04:49 von Bergamot
Nik Coughlin wrote:
>
> It's really, really easy to do columns without tables. Now, equal height
> columns on the other hand... can't be done without tables.
Not true. It can be done fairly easily with creative use of borders and
negative margins.
http://webhost.bridgew.edu/etribou/layouts/
http://www.bergamotus.ws/samples/3column-stretch-with-border s.html
--
Berg
Re: Multi Column Text Without Tables
am 12.07.2007 04:16:53 von Nik Coughlin
Bergamot wrote:
> Nik Coughlin wrote:
>>
>> It's really, really easy to do columns without tables. Now, equal
>> height columns on the other hand... can't be done without tables.
>
> Not true. It can be done fairly easily with creative use of borders
> and negative margins.
>
> http://webhost.bridgew.edu/etribou/layouts/
> http://www.bergamotus.ws/samples/3column-stretch-with-border s.html
You're cheating, those are hacks that make it seem like you have equal
height columns. You don't. But I should have been more specific, you can't
do a fluid 3 column layout where the columns are rounded corner boxes
implementing png transparency. Can't be done for Internet Explorer without
using tables.
I would love you to prove me wrong :)
Here's my take on it (an older version, but defining the problem):
http://www.nrkn.com/3ColRoundAlpha/
And (a newer version, given up on equal height but a lot of dumb things I
did in the first version have been fixed):
http://www.nrkn.com/3ColRoundAlpha/new/
The second is much nicer, but I haven't tried to make the columns equal this
time as I don't think it can be done in a cross browser fashion without
tables. Yes it has issues with IE<7 as you pointed out earlier :) But
those can be fixed easily enough.
Re: Multi Column Text Without Tables
am 13.07.2007 00:46:21 von Bergamot
Nik Coughlin wrote:
> Bergamot wrote:
>>
>> http://webhost.bridgew.edu/etribou/layouts/
>> http://www.bergamotus.ws/samples/3column-stretch-with-border s.html
>
> You're cheating, those are hacks that make it seem like you have equal
> height columns.
So? Appearances are everything! :)
> I should have been more specific, you can't
> do a fluid 3 column layout where the columns are rounded corner boxes
> implementing png transparency.
That is different thing altogether, of course.
--
Berg