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

[css3-box] Issue with the current shrink to fit algorithm

From: Giuseppe Bilotta <giuseppe.bilotta@gmail.com>
Date: Thu, 28 Oct 2010 13:52:46 +0200
Message-ID: <AANLkTikf93u62DYYaitAvGGY0Sp6NxV3TPXWyjJEQPEK@mail.gmail.com>
To: WWW Style <www-style@w3.org>
[this might come as a repost, since my previous mail seems to have got
stuck somewhere in the intertubes and is not appearing on the ML even
after 12 hours, despite me being subscribed. sorry for the noise]


I recently found myself in the following situation. I have a number
(say, 4) boxes with a given maximum width (DIV with
display:inline-block and max-width: 70ex). These boxes are all
first-level children of another box (DIV with #id content), and I
would like to achieve the following layout: as many inner boxes side
by side as fit in the viewport, then another row of boxes, etc. The
outer div would then shrink to fit its content and be centered. So my
CSS for #content is something like:

#content {
display: inline-block;
margin-left: auto;
margin-right: auto;

plus some padding and a border.

This works pretty well (i.e. gives the expected results) if the inner
boxes all fit within the viewport. If they don't don't, however, what
I get is two (or more) lines of boxes (which is ok), and #content
expands to match its containing block (which is a div with display:
block and as large as the viewport).

This is, if I understand the current specifications correctly, the
expected behavior, as the shrink-to-fit algorithm computes the width

min(max(minimum preferred width, available width), preferred width)

where the preferred width is computed by only considering obligatory
linebreaks. When the inner boxes can stay side-by-side, therefore, the
width is the preferred width (no linebreaks) while otherwise the width
is the available width (i.e. the whole viewport).

Although in my specific case I could work around the issue with an
extensive and boring list of media queries that relate the #content
max-width with the ratio of the viewport width to the inner boxes
max-width, I believe a better solution would be to have this done
automatically by the layout engine.

Therefore, I propose the following small change to the shrink to fit
algorithm: the preferred width should be computed by considering not
only the explicit linebreaks, but also the ones that would occur if
the width matched the containing block width. The new algorithm would
therefore be:

(1) find the available width: in this case, this is the width of the
containing block minus the used values of 'margin-left',
'border-left-width', 'padding-left', 'padding-right',
'border-right-width', 'margin-right', and the widths of any relevant
scroll bars
(2) find the preferred width by formatting the content as if the width
was set to the available width
(3) set the width to that of the largest line (anonymous box?) in the
formatted content

I do of course realize that due to legacy it would not be possible to
make this new algorithm the default one, but it should be possible to
make it available with an appropriate specification (width: inner-fit

Could I have your opinion on this proposal?

Giuseppe "Oblomov" Bilotta
Received on Thursday, 28 October 2010 11:53:34 UTC

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