Re: [css3-multicol] pseudo-algorithm

I wrote:

 > The pseudo-algorithm [1] to detemine the number width of columns
 > currently prescribes:
 > 
 >   width: 100px; column-gap: 49px; column-count: 3 /* results in 3 columns of 0.66px each */
 >   width: 100px; column-gap: 50px; column-count: 3 /* results in 2 columns of 0px each   */
 >   width: 100px; column-gap: 51px; column-count: 3 /* results in 1 column  of 100px */

 > [1] http://dev.w3.org/csswg/css3-multicol/#pseudo-algorithm

The sudden drop from 3 to 1 columns is unnecessarily dramatic, and
further from the specified 'column-count' than necessary. Opera therefore
suggests to tune the pseudo-algorithm slightly by changing line 24 from:

  (24)      N := floor(available-width/column-gap);

to 

  (24)      N := floor(available-width/column-gap) + 1;

This change will result in these number of columns:

  width: 100px; column-gap: 49px; column-count: 3 /* results in 3 columns of 0.66px each */
  width: 100px; column-gap: 50px; column-count: 3 /* results in 2 columns of 0px each   */
  width: 100px; column-gap: 51px; column-count: 3 /* results in 2 columns of 24.5 eachx */

I.e., it goes from 3 to 2 as the column-gap increases, and not from 3 to 1.

Below is a longer series, and I attach a perl script that implements
(this part of) the pseudo-algorithm.

-h&kon
              Håkon Wium Lie                          CTO °þe®ª
howcome@opera.com                  http://people.opera.com/howcome

column-gap: 10; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 11; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 12; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 13; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 14; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 15; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 16; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 17; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 18; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 19; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 20; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 21; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 22; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 23; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 24; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 25; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 26; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 27; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 28; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 29; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 30; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 31; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 32; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 33; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 34; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 35; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 36; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 37; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 38; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 39; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 40; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 41; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 42; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 43; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 44; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 45; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 46; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 47; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 48; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 49; column-count: 3; width: 100; /* currently: 3 columns -- revised 3 columns */
column-gap: 50; column-count: 3; width: 100; /* currently: 2 columns -- revised 3 columns */
column-gap: 51; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 52; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 53; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 54; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 55; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 56; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 57; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 58; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 59; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 60; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 61; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 62; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 63; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 64; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 65; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 66; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 67; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 68; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 69; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 70; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 71; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 72; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 73; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 74; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 75; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 76; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 77; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 78; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 79; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 80; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 81; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 82; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 83; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 84; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 85; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 86; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 87; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 88; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 89; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */
column-gap: 90; column-count: 3; width: 100; /* currently: 1 columns -- revised 2 columns */

Received on Monday, 7 February 2011 15:06:16 UTC