?

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

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 =)

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