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

Re: [css3-background] box-shadow syntax

From: fantasai <fantasai.lists@inkedblade.net>
Date: Tue, 19 Aug 2008 16:26:55 +0100
Message-ID: <48AAE63F.9010101@inkedblade.net>
To: Brad Kemper <brkemper.comcast@gmail.com>
CC: www-style@w3.org

Brad Kemper wrote:
> 
> Actually, from ease-of-use, maybe I am wrong, if you have to specify the 
> entire thing to make any changes. I was actually imaging that authors 
> might have access to the individual sub-values, like "box-shadow-color" 
> or "box-shadow-blur-radius". That goes beyond what is in this draft 
> though. If we did have that, then you could do this sort of thing:
> 
> JavaScript:
> myElement.style.boxShadowCast = "inner"
> 
> CSS:
> #myElement { box-shadow:  0.2em 0.2em #CCC outer }
> #myElement:hover { box-shadow-cast: inner }
> 
> But that requires this to be more of a compound property (in the same 
> manner as "background"). But even without that, I consider "inner" and 
> "outer" to be more common and understandable words to describe these 2 
> types of drop shadows than "inset". So really, if compounded 
> sub-properties were off the table, then I would just prefer to see 
> "inner" instead of "inset".

Ok. I'll mark that as an issue.

>> Also I'm wondering if people want to do combinations of inner and outer
>> shadows, maybe they should be separate properties so they can be set
>> independently? E.g. you might want to add an outer drop-shadow on :hover
>> without affecting any already-set inner shadows.
> 
> We've discussed that before here. From a logical perspective, based on 
> experience with real objects in the physical universe, an object can't 
> really be hovering above a surface if it is in fact a hole cut in that 
> surface. The only reason to have both at the same time is to create an 
> effect that is not really a drop shadow, such as a highlight.

Right. I expect we'll see it used to that effect.

>> The syntax I've drafted
>> allows you to have both at the same time, but you have to set them
>> together.
> 
> What does that look like in this syntax? Or do you mean you would add 
> another keyword to add as well for "outer"?

In the current syntax you can have both like this:

   box-shadow: 3px 3px, inset 3px 3px;

because the keyword is associated with each shadow, not with the entire
property.

~fantasai
Received on Tuesday, 19 August 2008 15:41:30 GMT

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