RE: New CSS utility: SelectORacle

One thing that might be useful would be to color-code both the input
selector and your output, so that, for instance, both "Selects any a
element" and "a" would be red, "with a title attribute with a value that
contains the word W3C" and "[title~="W3C"]" would be blue, and so on. I'm
not sure how feasible that is.

-----Original Message-----
From: Eric A. Meyer [mailto:emeyer@theopalgroup.com]
Sent: Saturday, April 14, 2001 7:01 AM
To: www-style@w3.org
Subject: Re: New CSS utility: SelectORacle


On Sat, 14 Apr 2001, Bjoern Hoehrmann wrote:

> Hm, I miss a feature that shows me the direct relationship between the
> selector and the produced text. Your example
> 
> > div>h1+*#text a[title~="W3C"][class="external"]:visited:hover
> 
> produces:
> 
>   Selects any a element with a title attribute with a value that
>   contains the word W3C, a class attribute with the exact value
>   external, whose target has been visited and which is in a hover state
>   that is a descendant of any element with an id attribute with a value
>   of text that follows a h1 element that is a child of a div element.
> 
> People in your target group will possibly ask "Why does it select any
> 'a' element???" and the SelectORacle doesn't help them much with this
> question.

   No, admittedly it does not.  We did at one point consider having the
utility construct example markup, but rejected it as unworkable and not
necessarily helpful anyway, since it might imply that only that one
particular
markup structure was a match for the selector.  Also because presenting the
output would be a relative nightmare.
   What might help is to add a class value to the result markup which
encloses
the "target" (in the above example, the 'a' element) so that I can style
it.  Do you think that would help clarify the results for those who would
ask
why the target is what it is, or would a different approach help?
   My target group is actually people who are somewhat familiar with CSS1,
and
who have used descendant (contextual) selectors, but are overwhelmed by the
apparent complexity of CSS2 selectors.  I've encountered many such people in
the last couple of months, which is what led to our creating this tool.  I
do
have in mind to accompany this tool with a short article of some type which
explains the basics of how selectors function, just in case.  That's a bit
down the road, however.

> But it's a cool tool :-)

   Thanks.  We do intend to improve it over time, including translations of
our translations-- see the main SelectORacle page for a link to our I18N
effort.

-- 
Eric A. Meyer                          http://www.meyerweb.com/eric/
 Author, "CSS: The Definitive Guide"   http://www.oreilly.com/catalog/css/
 Editor, Style Sheets Reference Guide  http://style.webreview.com/
 Coordinator, W3C CSS Test Suite       http://www.w3.org/Style/CSS/Test/

Received on Saturday, 14 April 2001 08:52:14 UTC