When I used Galeon, I often created custom CSS files for specific sites. When I moved to Firefox, that wasn’t built in, and I never cared to find out how to do it. The other day I got the urge and found something that worked, but it only works in Firefox 1.5 at home, not 1.5 at work. Who knows why.
Today I found Stylish. It has a nice GUI, let’s you edit styles without restarting FF, and has a few other perks. For one thing, if you have more bookmarks in your bookmark toolbar than will fit, the default is to make a little arrow you have to click to see them. This has the option of making them wrap, and making the bar bigger.
Why would you want to apply CSS to a specific site you ask? Lots of reasons. 🙂 I read UserFriendly every day, and they tend to run some really offensive ads for a "dating" service. The ads are in an iframe, so I just set iframe to { display: none} and the ads are gone.
Slashdot is a bit ugly. With the the new css layout they have, I can do stuff like change the colors, get rid of list bullets, or even move content around. Anything really.
It can be an easy way to boost the default font size of a page, or even a portion of a page.
Here are some of the things I’ve set:
slashdot.org – Remove ads
@-moz-document domain(slashdot.org) {
#advertisement-content { display: none; }
#advertisement-title { display: none; }
.ad1 { display: none; }
}
UF – Remove Ads
@-moz-document domain(userfriendly.org) {
iframe { display: none; }
}
It’s cool, easy to use, and quite nice when I need it.
The firefox adblock extension does the same thing even easier, and you can use regexps to block, say, ads from http:/*.doubleclick.net/*
Ed: my goal is not primarily to block ads though. It’s really to change the look and feel of remote sites. I just the UF ads because they annoy me, and the slashdot ads were in the default.