Open Bug 1408230 Opened 5 years ago Updated 2 months ago

mix-blend-mode not work correctly when z-index is applied to a parent div

Categories

(Core :: Layout, defect, P3)

56 Branch
defect

Tracking

()

Tracking Status
firefox57 --- wontfix

People

(Reporter: yoasif, Unassigned)

Details

Attachments

(2 files)

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:58.0) Gecko/20100101 Firefox/58.0
Build ID: 20171012105833

Steps to reproduce:

As seen on reddit: https://www.reddit.com/r/firefox/comments/75yof5/does_mixblendmode_not_work_on_deeply_nested/

Visit: http://jsbin.com/keqeceseca/2/edit?html,css,output



Actual results:

	<div class="wrapper">
		<div class="demo wrapped"></div>
	</div>

div is displayed with a black background.


Expected results:

div should have the same background color specified in html background color, especially since there is no overlap of divs.
I'd need to read the spec pretty carefully to understand what's supposed to happen here.
Priority: -- → P3
(In reply to David Baron :dbaron: ⌚️UTC-7 from comment #1)
> Created attachment 8918068 [details]
> reporter's testcase

Konqueror 4.14.25 @ Debian Testing:      blue body bg, both images have a white bg and black lines
Chromium 61.0.3163.100 @ Debian Testing: blue body bg, both images a black bg and white lines
firefox-esr 52.4.0 ESR @ Debian Testing: blue body bg, left image: white on blue + right image white in black
Nightly 20171020100426 @ Debian Testing: blue body bg, left image: white on blue + right image white in black
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.