W3C home > Mailing lists > Public > www-style@w3.org > May 2010

Re: [css3-multicol] The purpose of multi-column layout?

From: Andrew Fedoniouk <news@terrainformatica.com>
Date: Mon, 24 May 2010 16:13:11 -0700
Message-ID: <0247859844A4442188BE9FC642F14913@terra3>
To: "Aryeh Gregor" <Simetrical+w3c@gmail.com>
Cc: <www-style@w3.org>

From: "Aryeh Gregor" <Simetrical+w3c@gmail.com>
Sent: Monday, May 24, 2010 1:32 PM
To: "Andrew Fedoniouk" <news@terrainformatica.com>
Cc: <www-style@w3.org>
Subject: Re: [css3-multicol] The purpose of multi-column layout?

> On Mon, May 24, 2010 at 2:30 AM, Andrew Fedoniouk
> <news@terrainformatica.com> wrote:
>> Simple question: what is the purpose of Multi-column Layout Module
>> http://www.w3.org/TR/css3-multicol/ ? What problems it is trying to 
>> solve?
> Long lines of text are hard to read.  On wide monitors at typical font
> sizes, a full-width block of text is a real pain to read.  Columns
> break it into more readable chunks when it gets too wide without
> sacrificing screen real estate.

That is true but it should be the way of defining width of the column
in some deterministic manner (see below).  As for now widths of columns
may vary significnatly.

> One use-case is citations in Wikipedia articles.  The lines are often
> pretty short, so they wouldn't fill the width of the screen if
> positioned in a single column.  On the other hand, almost all readers
> will skip references, and those who look at them only care for a
> specific one, so you want them to be compact and unobtrusive.  Laying
> them out in multiple columns as the UA's screen width increases
> minimizes the space they take up.  In fact, some Wikipedia articles do
> lay out references using CSS columns, although most don't.
> Another use-case is apparently Robert O'Callahan's blog, although I
> admit I never saw the benefit of that.  ;)

That is a good example actually.

There are articles there that have height greater than view height
(depends on UA window size you typically use for browsing) that is
causing known inconveniences to read.

And yet it is almost a text, no images and tables so default
column-fill: balance works reasonably well.

With images, e.g. like this:
you can easily get into situation when you will be forced to use
manual column breaks to avoid almost empty columns at the end.
And that will cause significantly different renderings in different UAs
and font size used by the user.

>> But with HTML/CSS it is not quite so - pretty much each UA uses its own 
>> way
>> of measuring and rendering text - positions and dimensions of words may
>> vary,  sometimes significantly.  So you cannot design the CSS page as
>> newspaper page - e.g. it is not possible to ensure how many columns the 
>> text
>> will actually get, will all columns be filled in full, etc.
> That's why you can specify columns by width instead of number.  For
> instance, you could specify column-width: 50em; to ensure that if text
> gets more than 50em wide, it will be broken without sacrificing screen
> real estate.  column-count doesn't seem as useful, but it seems like
> an easy enough thing to add, so no reason to leave it out.

Well, it is not that simple under the hood.
E.g. the task of auto height calculation (column balancing)
is a nonlinear problem in math terms. And some combinations
with manual break-before/after: column; may oscillate.
Otherwise you will have empty last columns as in my example

>> Multi-column assumes that its content is rendered in the view with
>> horizontal scrollbar and without vertical scrollbar.
> Not really.  You'd just have to scroll up when you get to the end of
> each column, if the columns are tall enough.  I don't know how
> annoying this would be in practice -- maybe it wouldn't be a big deal,
> since if you have to scroll, the columns must be tall and so scrolling
> will be infrequent.  roc's blog posts are too short for me to have
> noticed any inconvenience from the columns.  But this is immaterial
> for the references use-case, since you aren't expected to actually
> read them from beginning to end.

Attempts to define height of the columns container:
ended with results that are, let's say, not so pretty.
I don't think that these are problems of particular implementation
but rather suspect problems of the spec itself.

And it appears that there is no way to define columns with fixed width.
  column-width: 20em;
in fact behaves as:
  column-min-width: 20em;
  column-width: 1*;
  column-max-width: 100%;

Ideally author should also be able to define
  column-width: 20em;
  column-count: auto;
  padding-left: 1*;
  padding-right: 1*;

so columns will always be of 20em and placed in the middle of .columns
container. That may make the layout to be more predictable.

Andrew Fedoniouk


Received on Monday, 24 May 2010 23:13:46 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:35 UTC