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

Re: [gcpm][grid] border-parts

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Thu, 30 Oct 2008 18:52:29 -0500
Message-ID: <dd0fbad0810301652v55b249d4r1443d7bff25c04c@mail.gmail.com>
To: "Håkon Wium Lie" <howcome@opera.com>
Cc: www-style@w3.org
On Thu, Oct 30, 2008 at 6:19 PM, Håkon Wium Lie <howcome@opera.com> wrote:

> Also sprach Tab Atkins Jr.:
>
>  > >  > What happens if you specify fr units within a repeat() expression?
>  > >
>  > > That would work as long as there are lenghts/percentages there as ell.
>  > > The resulting border parts would be very short -- especially in long
>  > > borders.
>  > >
>  > > If the repeat pattern consist of only on fractions, there would be
>  > > infinetely many of them. I've added text to make this illegal.
>  >
>  > Are you sure that works?  Say I specify border-parts: repeat(1fr 20px).
>  How
>  > many times can this repeat?
>
> The algorithm is specified in the text:
>
>  The exact border parts are determined by laying out the specified
>  border parts with all fractions initially set to zero. The border
>  parts specified before and after the 'repeat()' function are laid
>  our first. Thereafter, the repeat pattern is inserted between them
>  at least once, and as many times as possible without making the sum
>  of border parts longer than the border length. Any remaining border
>  is split proportionally between the fractions specified.
>
> So, if the border is 42px long, the pattern would repeat twice and
> with 1fr=1px; it would be the same as:
>
>  1px 20px 1px 20px
>
> If, however, the border is 40px long, the pattern can also be repeated
> twice if the fractions remain zero:
>
>  0 20px 0 20px
>
> Or, one could say that the fractions must have some length (how much?).
>
> I think it's ok for fractions to be zero. If you want the gap to have
> a minimal lenght, it can be expressed this way:
>
>  repeat(20px 10px 0 1fr)
>
> No?


Okay, that works in the simple case, when you interpret "repeat as much as
possible" as "shrink those damn fractions down as much as you can" (which is
a valid and reasonable way to act).  And yeah, that method of ensuring a
minimal length works as well.

What about this case, though?

border-parts: 1fr 10px (repeat 1fr 10px);

Let us say the width of the area is 55px.  The algorithm would first fill in
the 10px "off" spot, leaving 35px to be filled in.  The repeat would then
execute 4 times, because 5 would be too much.  This leave 5 px to work with,
and 5 fr blocks to take them, 4 within a repeat block and 1 outside.  At
this point, do we pretend that the pattern was written explicitly as "1fr
10px 1fr 10px 1fr 10px 1fr 10px 1fr 10px", and fill all the fractions
equally?  Or do the fractions in the repeat block get priority over the
outside fraction in a similar way that the repeat block itself does?  I
really dislike the latter option, as it sets up a hierarchy of fr units
within a single property.


Returning to the flexing of the repeat() block for moment, I'm becoming
dissatisfied with it.  Using a repeat() block basically makes any other
flexes completely irrelevant except for filling in small pixel gaps that
might appear. While this is useful on its own, I think it takes away from
the usefulness of this construct.  It also implicitly prevents us from using
two repeat() blocks in a single declaration, which could be useful as
"border-parts: repeat(10px 10px) repeat(20px 20px) repeat(10px 10px) 0 1fr",
to get a border which repeats a short-dash pattern on the outer section but
a large-dash pattern in the middle.  The preferred rendering of this would
be the three repeat() blocks flexing by themselves, so that each takes up
1/3 of the border.  A similar rendering would replace the central repeat
block with a plain 1fr "on" section, making a solid border that breaks up
around the edges (this could also be achieved with a repeat(1px 0) block in
the middle instead).  I think this would be a pleasing visual effect, but
it's currently impossible to do with repeat().  Instead, you have to
manually specify the "10px 10px" blocks to some amount, which will only
achieve the preferred visual style on particular element widths.

So, how about the repeat() block optionally taking a second parameter which
gives its personal width?  Being able to specify a width in absolute units
would be convenient, but superfluous.  On the other hand, specifying a width
in fractions or % would be very useful.  The current behavior of repeat()
(acting like its width is Infinite fr) is useful and good because it
minimizes the effect of the implicit 1fr at the end of the property, and
multiple repeat() blocks should act like they all have the same flexible
width by default.

Don't commit to this yet, though - I'm still not sure how to treat
"border-parts: 1fr repeat(20px 1fr, 1fr)".  ^_^

~TJ
Received on Thursday, 30 October 2008 23:53:06 GMT

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