The default bug view has changed. See this FAQ.

-moz-box-shadow renders box-shadow behind an image element if specified for img

RESOLVED INVALID

Status

()

Core
Layout: View Rendering
RESOLVED INVALID
7 years ago
7 years ago

People

(Reporter: Divya Manian, Unassigned)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(URL)

(Reporter)

Description

7 years ago
User-Agent:       Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_6_4; en-US) AppleWebKit/534.3 (KHTML, like Gecko) Chrome/6.0.466.4 Safari/534.3
Build Identifier: 4.0b3pre

The spec says box-shadow should render on all elements.  The inset shadow seems to render behind the contents of the element, this would be fine for all elements except the image element, where it should render in front of the image to serve any useful purpose. 

You can see this in action on the URL mentioned. The left image does not seem to have any box-shadow, but the right image (which is a transparent version of the left one) has them. 

Also reducing the opacity of the image does not seem to have any effect on getting the box-shadow to show. 

This is a cross-browser issue: Safari/Chrome/Opera/Firefox. 


Reproducible: Always

Steps to Reproduce:
1.Click the URL
2.
3.
Actual Results:  
No box shadow on the image

Expected Results:  
There should be a inset box shadow on the image

http://dev.w3.org/csswg/css3-background/#the-box-shadow
This looks like how things are supposed to work.  Why do you think they should work some other way?
(Reporter)

Comment 2

7 years ago
I assert that is not how it is supposed to work for image element. 

The spec says:

"The shadow effects are applied front-to-back: the first shadow is on top and the others are layered behind…In terms of stacking contexts and the painting order, the outer shadows of an element are drawn immediately below the background of that element, and the inner shadows of an element are drawn immediately above the background of that element (below the borders and border image, if any)."

My view is the last sentence does not apply completely to an image element, given that typically it does not have a background.
Image elements can have backgrounds, which you'll see when the image is partly or completely transparent.

Comment 4

7 years ago
Yes, but having an inset shadow on an image's background is simply not the same as the actual image having an inset shadow.

http://jsbin.com/asede3/2
Marking invalid, since this is what the spec in fact says we should do; bringing spec changes up on www-style as you did is the right thing.  If the discussion there leads to a spec change, please reopen.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 7 years ago
Resolution: --- → INVALID
You need to log in before you can comment on or make changes to this bug.