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

Re: Collapsing elements

From: Bert Bos <bert@w3.org>
Date: Thu, 21 Feb 2008 19:31:33 +0100
Cc: www-style <www-style@w3.org>
To: Undisclosed.Recipients: ;
Message-Id: <200802211931.33720.bert@w3.org>

On Thursday 21 February 2008 16:47, Brad Kemper wrote:

> The word "initial" sounds like it is only something that exists at
> the beginning, and once someone starts collapsing or expanding it, it
> is no longer initial. Does "initial" represent an open branch of the
> tree or a closed one? It would depend on the style sheet, I guess,
> but that makes its meaning vague.

That's on purpose. I'm not tied to the name "initial," it just seemed a 
reasonable word to express the two ideas that (1) there exists another 
state and (2) this state is the default.

Another option is giving a name to the second state rather than the 
first. E.g., ':alternative':

    ul {content: attr(title)}
    ul:alternative {content: contents}

alhough to keep the element readable in old browsers, one might want to 
write that as:

    ul:not(:alternative) {content: attr(title)}

(It's actually shorter like that, but it makes you think harder :-) )

> I would prefer something that more 
> definitively indicated its actual current state ("opened" or
> "closed"), the way "checked" does for checkboxes and radio buttons.

I started with that idea, but abandoned it for the more general (and 
admittedly more abstract) idea of initial and alternative states, 
because one state is not necessarily more "closed" than the other:

    div img.recto {display: none}
    div:alternative img.verso {display: none}
    ...
    <div>
      <p>Click to see the other side:
        <img class=recto src="recto.jpg" alt="front - title">
        <img class=verso src="verso.jpg" alt="back - index">
    </div>

Or:

    p.warning {font-size: xx-small}
    p.warning:alternative {font-size: large}
    ...
    <p>Click to enlarge:
    <p class=warning>Warning: This paragraph is too small to read.

(Yes, I know "click" is not the right word to use in an HTML document, 
because not everybody has a mouse, but it's just for the example.)

I even tried n-state elements (n >= 2), but that became very abstract 
indeed...

> But rather than invent a new state and pseudo-class, I would rather
> see "checked' repurposed for this type of list, and given a
> definition to mean open if checked and closed if unchecked.

My intuition says that overloading ':checked' is dangerous and not very 
intuitive. In the examples I gave so far there is nothing that I would 
associate with putting a check mark. It's collapsed, expanded, toggled, 
set to an alternative state, set to a second state, maybe changed or 
restored, but not checked...

>
> The author could always simulate reverse behavior if they wanted to,
> I suppose, but the default style sheet could just make "checked" tree
> LI's opened, and "unchecked" LI's closed.

That would take away all the flexibility. It's not just lists I want to 
collapse, it's paragraphs and sections as well. And 
sometimes "collapsing" doesn't mean hiding, but making it smaller or 
making it gray.



Bert
-- 
  Bert Bos                                ( W 3 C ) http://www.w3.org/
  http://www.w3.org/people/bos                               W3C/ERCIM
  bert@w3.org                             2004 Rt des Lucioles / BP 93
  +33 (0)4 92 38 76 92            06902 Sophia Antipolis Cedex, France
Received on Thursday, 21 February 2008 18:31:47 GMT

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