25 October 2008

Reusing Custom Page Styles With @-moz-document

After using the Firefox Stylish add-in to increase the contrast between the text and background colours of domains, I wanted to apply the same rule to different domains. In this case, I want to reuse the text colour of P elements in two or more domains.

Open a Stylish script and note that it has a sequence of @-moz-document definitions, for example:

@-moz-document domain(addons.mozilla.org) {
  p { color : black; }
}

@-moz-document domain(msdn.com) {
  p { color : black; }
}

The @-moz-document rule can accept a comma-separated URL list, so I can re-use my style definition like this:

@-moz-document domain(addons.mozilla.org), domain(msdn.com) {
  p { color : black; }
}

See Also