CODEWITHSUNDEEP
cssfirefox-addonxul
Noitidart
Noitidart

Reputation: 37238

CSS Specficity in XUL

There's a default style sheet which has:

toolbarbutton {
  -moz-appearance: toolbarbutton;
}

now i want to change thatappearnce is none lik this:

.profilist-tbb {
  -moz-appearance: none;
}

this is the element:

<toolbarbutton class="profilist-tbb"></toolbarbutton>

however the computed style, (and when i hover over it, it is obvious) the -moz-apperance is toolbarbutton which follows the default style sheet.

however my classses backgroundColor just won't take.

the css specficity is that class is higher than element. if you apply this in html it works fine: http://jsfiddle.net/c5hr1579/

how to make my class be more specific? even if i set id of my toolbarbutton to profilist-tbb and change stylesheet to #profilist-tbb{ it doesnt take.

Upvotes: 1

Views: 65

Answers (1)

nmaier
nmaier

Reputation: 33162

Given that you most likely use nsIDOMWindowUtils.loadSheet (or the style sheet service), you should load the sheet as Ci.nsIDOMWindowUtils.AUTHOR_SHEET, so that the sheets are placed in the correct position within the cascade.

Right now, you appear to be using USER_SHEET. That will cause the sheet to be inserted before any author sheets, including chrome://global/skin/toolbarbutton.css (which is an author sheet), which then resets your -moz-appearance again.

Upvotes: 1

Related Questions