?

Log in

No account? Create an account

Previous Entry | Next Entry

CSS3 - Multicolumn Layout

weather: drizzling
outside: 9°C
mood: waaaah...
Multicolumn Layout — CSS3


You go:

.my3cols {
   width: 100%;
   column-count: 3;
   column-gap: 10px;
   column-rule: none;
}

Then <div class="my3cols"> [Lorem Ipsum] </div>

All the Lorem Ipsum will be auto-flowed into columnar output, like this:

----- ----- -----
----- ----- -----
----- ----- -----
----- ----- -----
----- ----- -----
----- ----- -----
----- ----- -----

However, the CSS WG Status Table says:

Multi-column layout in CSS proposes new properties to create flexible column
layouts. It may eventually be integrated into some module, or it may not.

Translation:

It's still in the second working draft. Given the reality of how long it's taken to get
even CSS1 part of the browsers, support for multi-column layout is a long way out.

          — Craig Saila

* C R Y * C R Y * C R Y *

Tags:


Comments

( 15 comments — Leave a comment )
sertrel
Jan. 12th, 2004 04:05 pm (UTC)
How did you get so interested in interface, typesetting, layout, presentation, and formatting? Is this interest derived from artistic endeavour, or through function and efficiency?
bride
Jan. 12th, 2004 04:11 pm (UTC)
I've been on several projects at work that involve QuarkXPress and various applications in the realm of pre-press, printing and publishing. =)

A lot of people are very interested in web and other non-traditional publishing methods.
kvance
Jan. 12th, 2004 05:25 pm (UTC)
Yeah, I was gonna say that sounds way too convenient :P
bride
Jan. 12th, 2004 05:59 pm (UTC)
Apparently, Nutscrape 3+ supports a browser specific hack: <multicol width="100%" cols="3" gutter="10">

*sigh*
pne
Jan. 13th, 2004 03:28 am (UTC)
multicol
*nods* I was going to mention that.

Is that still in Netscape 6/7 (the Mozilla-based ones)? I can imagine they took it out when they started to get more standards-compliant themselves.
bride
Jan. 13th, 2004 08:10 am (UTC)
Re: multicol
It's not in Mozilla 1.5 (I tried it last night). I'm not sure about Firebird, but I somehow doubt it. There are more important things to do with Firebird =)
brokenclay_
Jan. 12th, 2004 07:39 pm (UTC)
In case you haven't already perused these:
http://css-discuss.incutio.com/?page=ThreeColumnLayouts

Katja
bride
Jan. 12th, 2004 07:52 pm (UTC)
Oh, that's not the same kind of "3 column layout" I want. I want the whole "body stream" text to automatically flow in three columns. I only need one text container or box, but the text is split inside that container and goes from the bottom of the first column to the top of the second, etc. Like this post of mine. That was done manually with a table, but the CSS3 spec. proposes a browser implementation.
brokenclay_
Jan. 12th, 2004 08:07 pm (UTC)
Yeah, I see what you're looking for, but it didn't work automatically in tables, either, did it?
Besides, I think there are strong usability arguments against using newspaper style flowed columns on web pages - it forces the reader to scroll up and down too much. JM(not so)HO.
bride
Jan. 13th, 2004 08:18 am (UTC)
I think there are strong usability arguments against using newspaper style flowed columns on web pages - it forces the reader to scroll up and down too much.

Yeah, I can see that.

I can also see it implemented such that the column height automatically adjust to the browser view area height, so the amount of scrolling is no more than before. We can wrap the text to the width of the browser view area, it's not a stretch to do something specific with the height either. Then you get the benefits of not having to run your eyes all the way across the page.
brokenclay_
Jan. 13th, 2004 09:46 am (UTC)
I can also see it implemented such that the column height automatically adjust to the browser view area height, so the amount of scrolling is no more than before.


That's good - I've been spending too much time with pixel-perfect designers who want to dictate what's above the fold, what's below the fold, and where the damn fold is!
bride
Jan. 13th, 2004 10:00 am (UTC)
Heh, they often don't realize that the "canvass" is not the same size and resolution for everyone. It's not like physical paper where you know the exact measurements and _can_ dictate where the fold goes =)
razorw
Jan. 12th, 2004 08:51 pm (UTC)
Interesting ...
bride
Jan. 13th, 2004 08:19 am (UTC)
It'll be another toy =)
razorw
Jan. 13th, 2004 08:46 am (UTC)
I bet ;o)
( 15 comments — Leave a comment )

Profile

eLouai
bride
The Bride of the First House

Latest Month

March 2015
S M T W T F S
1234567
891011121314
15161718192021
22232425262728
293031