W3C home > Mailing lists > Public > www-style@w3.org > September 2011

Re: suggestion of adding top,right,bottom,right to box-shadow

From: Alan Gresley <alan@css-class.com>
Date: Thu, 15 Sep 2011 03:41:41 +1000
Message-ID: <4E70E755.8060809@css-class.com>
To: Brad Kemper <brad.kemper@gmail.com>
CC: shi chuan <shichuanr@gmail.com>, Simon Fraser <smfr@me.com>, "www-style@w3.org" <www-style@w3.org>
On 15/09/2011 1:27 AM, Brad Kemper wrote:
>
> On Sep 14, 2011, at 7:31 AM, Alan Gresley wrote:


>> I'm not sure what Shi really wants.
>>
>> Maybe a mock up graphic may help us know what you are seeking.
>
> My understanding was based on following Shi's link [1], which leads
> to a page [2] that has a link to the site, where there is a
> navigation strip in which the shadow seems to be laying with the
> other elements in an undesirable way. So it looks like either
> cropping the shadow or having a way to send it to a different z-index
> (outside the element's context) would be the most direct way to solve
> the problem.


Oh, I didn't see that link. Upon reading this.

   | This shadow will be applied to a nav bar on a page,
   | the bar is positioned on the top of the main
   | container DIV. What I am trying to accomplish
   | is to continue the box shadow of the main DIV onto
   | the nav bar, which sits above it, but without a
   | bottom shadow on the nav bar.


The simple way to do this is by source ordering. Like so.

  (hacked together badly but shows the concept)


http://css-class.com/x/shadow-test.htm


This is the CSS added.

#mainContainer {
   float:left;
   margin-right: -1000px; /* this negative margin allows content to rise 
above this float */
   position:relative;
   z-index:1;
}

#servicesContainer{
   box-shadow: -5px -5px 5px -3px silver;
}

#nav-box {
   margin-top: -30px;
   margin-left:200px;
   float:left;
}






> 2. http://innovideoproductions.com/


-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/
Received on Wednesday, 14 September 2011 17:42:18 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:44 GMT