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

Re: CSS: %% length unit. Proposal. Some clarifications.

From: Andrew Fedoniouk <news@terrainformatica.com>
Date: Tue, 11 May 2004 16:01:34 -0700
Message-ID: <003f01c437ab$e949f510$1902000a@AFedoniouk>
To: "David Hyatt" <hyatt@apple.com>
Cc: <www-style@w3.org>, "L. David Baron" <dbaron@dbaron.org>

Hi, David,

Perfect example!

Let's try to define vertical scrollbar (as it is in Win32) using %% units:

.arrow-button {
   max-height: 24px;
   height: 50%%;
}

.thumb-button {
  margin-top: XX%%; /* XX = F(WindowPosInTheDocument) 1..100*/
  height: YY%% /* YY = F(WindowHeight,DocumentHeight) - 1..100  */
}

.thumb-arena {
   height:100%%;
}

<div id=vscrollbar style="width:24px; height:ZZpx">
   <div id=up class=arrow-button />
   <div id=thumb-arena class=thumb-arena />
        <div id=thumb class=thumb />
   </div>
   <div id=down class=arrow-button />
</div>

If total height of vscrollbar will become less then 24+24+48 then up and
down buttons will start to change their sizes in proportion
up/thumb-arena/down = 50:100:50.
If you will set thumb-arena height to 0 then  up/down will occupy the whole
vscrollbar height in proportion 50:50.

This is not tested for a while. I'll try to reproduce it tomorrow in the
renderer.
But I am sure that we don't need levels of flexing here as we can always
setup constraints by
using min-height and max-height.


Andrew Fedoniouk.
http://terrainformatica.com


> The problem I have with your proposal is that you are overloading the
> concept of flexing onto the concept of width.  These are two
> independent concepts.  It should be possible to say that object A has a
> width of 100px but a flex of 5, but that object B has a width of 200px
> and a flex of 1 (or no flex at all, etc.).
>
> If you overload the flexing concept onto width, then you prevent the
> separate specification of width and flex for a single element.
>
> XUL solves this problem by introducing a separate CSS property,
> box-flex, that is implemented by Mozilla and Safari.
>
> Another important flexing concept for UI elements (like scrollbars) is
> levels of flexing.  We call these flex groups in XUL.  Currently only
> Safari implements flex-group support.  The idea is that objects can be
> placed at different flex levels, so that - for example - you might want
> the track of a scrollbar to flex as you shrink the scrollbar, but once
> the track is completely gone, then the up/down buttons on the scrollbar
> could start flexing as you get even smaller.
>
> I think flexing works best when used with a specific new display type
> (a new type of container), so that the rules can be easily specified,
> and you don't have to handle how flexing works in arbitrary line layout
> (which I think would be unnecessarily complicated given the use cases I
> would expect for such a feature) or in the presence of floats.
>
> dave
>
> On May 11, 2004, at 2:57 PM, Andrew Fedoniouk wrote:
>
> >
> > For me personally the concept of "auto" is one of the most confusing
> > things
> > in CSS:
> > Bad dream of implementor: "...'auto' replaced by some suitable value,
> > but
> > there are exceptions...".
> >
> > E.g. why margin-left/right:auto in some cases is exactly 50%% and
> > margin-top/bottom:auto is nothing in most(or in all?) cases?
> >
> > %% is an attempt to formalize this 'auto' concept if you wish.
> >
> > width:50%  and width:50%%  are basicly the same entities
> > but in first place ContainerContentWidth is used as base for computing
> > percents and
> > in second place it is FreeSpace which is function of
> > ContainerContentWidth.
> >
> > Andrew Fedoniouk.
> > http://terrainformatica.com
> >
> >
> > L. David Baron  wrote:
> > "This means that, while it's a value for the 'width' property, it's not
> > actually describing the width, but rather a factor to be added to an
> > 'auto' width.  That seems confusing, and might lead authors to expect
> > that of 'width' in other cases as well (as some buggy browsers already
> > do, especially for 'height')"
> >
> >> first:
> >>    compute everything as %% does not exist at all.
> >>    apply all paragraph wrapping rules as usual.
> >> second:
> >>    compute free space for each line box which we've got on first step.
> >>    compute all elements which have %% according to free space.
> >>    replace elements in line boxes.
> >
> >
>
Received on Tuesday, 11 May 2004 19:02:12 GMT

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