Closed Bug 554717 Opened 10 years ago Closed 8 years ago

audio/video controls pick up surrounding list-style-image


(Toolkit :: Video/Audio Controls, defect)

Not set





(Reporter: philip, Assigned: fryn)





(1 file, 1 obsolete file)

When the list-style-image CSS property is set on an audio/video element or an ancestor (see example in URL), that image gets rendered on top of the play and volume buttons. It ought to be ignored, else the controls look weird on pages that happen to use list-style-image for other purposes.

Tested in Mozilla/5.0 (X11; U; Linux i686 (x86_64); en-US; rv:1.9.3a4pre) Gecko/20100324 Minefield/3.7a4pre
Component: Video/Audio → Video/Audio Controls
Product: Core → Toolkit
QA Contact: →
The controls should probably style themselves with list-style-image:none.
Actually, I would have expected inheritstyle="false" to prevent this.

...and it probably does, except it seems I forgot to add that somewhere along the line! :-o
Hrm. It doesn't. I thought that controlled if external style affected the binding, but upon rereading the XBL docs it seems to imply it just controls style from other bindings? [Slightly oddly, I can't content style rules to affect the video controls directly, though.]

This seems somewhat unfortunate; to fully fix this bug it seems like I'd have to figure out every style attribute in the videocontrols that defaults to inherit, and make sure it's explicitly set to some value at the root binding node? Would be nice to have a way to say inheritstyle="ignorecontent". Also, XBL2 and a pony. :/
Assignee: nobody → fryn
Attached patch patch (obsolete) — Splinter Review
(Exporting stuff from my patch queue before embarking on a new project.)

I think we can go ahead and land this. In a quick search, I couldn't find any other obvious style properties that exhibit this inheritance problem with video/audio controls. I will also file a bug for preventing style inheritance into <xbl:content/> in the general case.
Attachment #550259 - Flags: review?(dolske)
Oh wait. Font properties also get messed up.

Ah, I see that bug 335281 got marked INVALID. If anything, a stylesheet-based "CSS reset" would be handy here, e.g. something like:

[resetstyles=true] {
  list-style-image: none;
  font-weight: normal;
  font-style: normal;
  /* insert other properties that need to be reset */
Attached patch patch v2Splinter Review
I went through the list of inherited properties, and this seems to cover it.
Attachment #550259 - Attachment is obsolete: true
Attachment #550264 - Flags: review?(dolske)
Attachment #550259 - Flags: review?(dolske)
Comment on attachment 550264 [details] [diff] [review]
patch v2

Review of attachment 550264 [details] [diff] [review]:

Is that just the inherited properties that currently can impact videocontrols? Seems short. :) Anyway, better than nothing.
Attachment #550264 - Flags: review?(dolske) → review+
Pushed to fx-team:

(In reply to comment #7)
> Is that just the inherited properties that currently can impact
> videocontrols? Seems short. :) Anyway, better than nothing.

I checked this table of CSS2.1 properties:

There could be properties in CSS3:

or Mozilla CSS Extensions:

that could impact videocontrols, but those lists don't have a convenient boolean "inherited" column, so I didn't take the time to check them all.
OS: Linux → All
Hardware: x86 → All
Target Milestone: --- → mozilla8
Closed: 8 years ago
Resolution: --- → FIXED
There is a potential spoof vector here. I'd suggest [sg:spoof] or something in the whiteboard.
Depends on: 1218974
You need to log in before you can comment on or make changes to this bug.