Reclaim The Web With User Style Sheets

Published: 12/25/2004 | Updated: 12/25/2004 | Discuss

Mozilla browsers come with a wonderful feature that allows you to get rid of annoying content, such as online advertisements. The name of this feature is user style sheets. You control appearance of any web content with a configuration file, userContent.css. I’ve already spoken harsh words about online advertising, so this feature is a blessing.

Straight from the horse’s mouth:

This file sets the display rules for web content and is located in the sub-folder called chrome in your profile folder.

Mozilla’s web site explains further where to find the profile folder mentioned above.

I visit MSNBC quote often. I like their news coverage, but I get greatly annoyed by the abundance of ads on their pages. At times, there are more ads than content. It’s easy to solve the problem with a user style sheet by simply hiding their ad content. For example, if a page has a flashy banner inside a hypothetic <div id="promo">...</div> you need to add a rule to your userContent.css:

#promo {
   display: none !important;
}

Folks at Mozilla also share a nice pre-cooked stylesheet that tackles a lot of various ad content. I regret I haven’t found it sooner. This one is a must copy-and-paste for my user CSS. So far I’ve added CSS rules to hide nuisance at weather.com, Ask Jeeves (their sponsored links take way too much space) and a couple of other sites.

#Sponsored,
#SponsoredOutline,
#DCol,
.promocolumn,
.issf,
.issb,
.ssb,
.adtext,
#RefAd,
#ovtrfrm,
#swap-adSpotIsland,
Promo { 
   display: none !important; 
}

Be Nice To Others

I’m a big believer in CSS signatures, i.e. placing a unique ID on the html or body tag. Whether to ID html or body is up to you. I’m with Anne on this and choose to ID html:

<html xmlns="http://www.w3.org/1999/xhtml" 
      xml:lang="en" 
      id="www-aspnetresources-com">
  ...
</html>

By doing this you allow others to change the colors of your hyperlinks, for example, and the like. I think it’s a matter of good nettinzenship.

By the way, feel free to grab my userContent.css. If anyone wants to contribute, please, email me yours and I’ll update the download.

1 mahesh | Friday, September 14, 2007 at 6:52 AM

Hi,

I cant apply this method to ASP.NET web controls or HTML controls runat=server.

Please help me.

regards,
mahesh

2 Milan Negovan | Sunday, September 16, 2007 at 2:21 PM

Mahesh, why not? The approach discussed has nothing to do with server controls.

Reclaim The Web With User Style Sheets

Be Nice To Others

Comments

Emails and Notifications

TrackBacks

Submit your comment