607055 - opacity error using rgba when it's apply to it's children

Status: RESOLVED WORKSFORME

(Core :: Graphics, defect)

Description

[Carlos A. Cabrera]

User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US) AppleWebKit/534.7 (KHTML, like Gecko) Chrome/7.0.517.41 Safari/534.7
Build Identifier: Mozila Firefox for Ubuntu canonical -1.0 (3.6.11)

li:hover {
  background-color: rgba(100,100,100, .10);
}

The idea of the CSS code above is that the li children of li becomes darker as it gets deeper. This work on WebKit but it's buggy on Firefox.

Reproducible: Always

Steps to Reproduce:
1. Create an html list with 3 levels.
2. Use the following CSS code:
  li:hover {
    background-color: rgba(100,100,100, .10);
  }
3. Check behavior on Firefox against Safari/Chrome.
Actual Results:  
Works fine on two level list:
<ul>
 <li>First
  <ul>
   <li>Second

However, the rgba values don't apply to the text on the list. Backgrounds start going on and off on a third level list.

Expected Results:  
First level should be 10% transparent. Second level 20% (First level 10% plus second level 10%, and so on).

Comment 1

[philippe (part-time)]

Can you attach a test case that shows the issue ?
Based on what you say in comment 0, I can't reproduce the issue, not on Linux (Ubuntu 10.4) not on OS X.

Comment 2

[Carlos A. Cabrera]

Try this URL in both Chrome and Firefox and let me know if you notice the difference on mouse hove behavior http://iamatx.com/ff.html

Comment 3

[philippe (part-time)]

Your testcase displays fine for me. The background-color is darker according to the nesting.

OS X 10.6 and Linux Ubuntu 10.4.

Comment 4

[philippe (part-time)]

Attachment: testcase from reporter

Comment 5

[Boris Zbarsky [:bzbarsky]]

Yep.  Worskforme as well.

> Build Identifier: Mozila Firefox for Ubuntu canonical -1.0 (3.6.11)

Do you see the problem with a mozilla.org build?  Or just with Ubuntu's builds?

Comment 6

[Carlos A. Cabrera]

Working now on Ubuntu and OSX.