Search code examples
csswebkit

Is there a way to have a CSS selector apply to a specific host? (For my custom browser stylesheet.)


I want to apply styles (edit:in my browser's user-defined stylesheet, a local file on my machine that let's me customize how other people's websites render for me) to a specific site, but the selectors on many web pages are often generic (and obviously out of my control, since they're not my websites.)

If I have to use very general selectors (eg. #box) to customize a given website, that style might unintentionally affect other websites that have that same generic selector. Is there a way to specify a domain with a selector so I can my custom styles for each website separate?

I also found @-moz-document which looks good, but is Mozilla-specific and I use a WebKit browser. Is there an equivalent?

@-moz-document url(https://www.example.com/decrypt.php) {

Solution

  • Is the CSS hosted on a server that also allows you to script? Have you tried writing a server-side script to generate the correct CSS rules depending on the host that's serving the page?

    Edit added March 30 2010:

    You might be better off using the Greasemonkey extension to do this. It's far more powerful than user-defined stylesheets since you can use JavaScript, and adding domain or page-specific rules is as easy as adding special tags to the comments in the header. Greasemonkey was made specifically for handling your type of problem, and while you need a plugin to run Greasemonkey scripts in Firefox, Chrome ships with Greasemonkey support built-in.