W3C home > Mailing lists > Public > www-style@w3.org > October 2008

Re: [css3-multicol] column overflow

From: David Hyatt <hyatt@apple.com>
Date: Thu, 16 Oct 2008 14:35:32 -0500
To: Håkon Wium Lie <howcome@opera.com>
Cc: "www-style@w3.org List" <www-style@w3.org>, Robert O'Callahan <robert@ocallahan.org>
Message-id: <D93A0E54-4AFB-4281-957D-7BEF5E98F3ED@apple.com>

Let's say you had way more text in your example, such that you had 3  
tiny columns and 24 more columns in the current implementations (all  
spilling out horizontally).

Are you proposing that those 24 extra columns would be stacked  
vertically in 8 overflowing rows of 3?  I think this would be ideal,  
since I could hit "page down" scrolling and read each "column page."

dave
(hyatt@apple.com)

On Oct 16, 2008, at 2:28 PM, David Hyatt wrote:

>
> I like the idea.  I think it's a much better solution than spilling  
> out horizontally.  Make sure to account for block direction and  
> inline-progression-direction when specifying where the extra columns  
> get placed.
>
> dave
> (hyatt@apple.com)
>
> On Oct 16, 2008, at 2:21 PM, Håkon Wium Lie wrote:
>
>> CSS3-multicol describes how to lay out content into multiple columns
>> [1]. The benefit on multicol layouts in paged media is clear.
>> Continuous presentations -- in browsers with scrollbars -- provide
>> some challenges. For example, when columns are longer that the
>> viewport, users will find themselves scrolling up and down repeatedly
>> to read the content. One way to address this problem is to set the
>> 'max-height' (for horizontal writing systems) of an element so that  
>> it
>> will fit most people's viewport.
>>
>> However, adding constraints on the height will lead to content
>> overflow. The spec doesn't say exactly what should happen in these
>> cases, but the examples suggest that more columns should be added on
>> the side. This is also what the two current browser implementations
>> (Mozilla and WebKit) do.
>>
>> This behavior leads to horizontal scrolling, which is arguably worse
>> than repeated vertical scrolling. Jacob Nielsen, at least, argues  
>> that
>> horizontal scrolling should be avoided [2].
>>
>> One alternative method that has been suggested (most recently by  
>> David
>> Storey) is to place the overflow content underneath the first set.  
>> One
>> can think of this as cloning the original multicol element as many
>> times as necessary and stacking them on top of each other.
>> Margin/padding/border set on the original multicol elements will also
>> be honored for the cloned elements.
>>
>> So, for a three-column layout with overflow and constrained height  
>> you
>> would get:
>>
>>  This is some  to test multi-  This sentence
>>  sample text   column layout.  continues in
>>
>>  the next col-
>>  umn.
>>
>> instead of
>>
>>  This is some  to test multi-  This sentence  the next col-
>>  sample text   column layout.  continues in   umn.
>>
>> (monospaced text is assumed in this example)
>>
>> Personally, I think this is more friendly to users. Pioneer
>> implementors will have to change their code to make this work. AFAIK,
>> support for multi-column layout hasn't been turned on official yet  
>> one
>> still has to use prefixed property names to enable it. So, there's
>> still time to fix it if we agree that it's a better solution.
>>
>> What do people think?
>>
>> [1] http://www.w3.org/TR/css3-multicol/#overflow
>> [2] http://www.useit.com/alertbox/20050711.html
>>
>> -h&kon
>>             Håkon Wium Lie                          CTO °þe®ª
>> howcome@opera.com                  http://people.opera.com/howcome
>
>
Received on Thursday, 16 October 2008 19:36:14 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:55:15 GMT