I posted something previously on blocking social ads in facebook with greasemonkey, where I came to the conclusion incorrectly it could not be done with css. I apparently remembered what “! important” did in userContent.css and userChrome.css; I read “! important” as “not important,” but it aparently means the opposite, and overrides any webpages css. I corrected my post on userContent.css and userChrome.css customization as well. Stupid logic. Anyway, if you add the following block into your userContent.css file, you should be able to block most annoying stuff on both the new facebook design and old.

@-moz-document url-prefix(http://www.new.facebook.com/) {
.sponsor, .invitefriends, .findfriends, .gifts_received, .pymk, .social_ad, .adcolumn{
display: none ! important;
}
}

@-moz-document url-prefix(http://www.facebook.com/) {
.sponsor, .invitefriends, .findfriends, .gifts_received, .pymk, .social_ad, .adcolumn{
display: none ! important;
}
}

There may be a way to combine these two, but I don’t know the more mozilla-internal css well enough to know. If you use facebook, most of these should be clear. I blocked gifts, as I find them annoying, and I am glad to just not be aware of them. I also blocked the person finding features like “people you may know” (’.pmyk’) or the email search things. I also blocked ads of course. Facebook seems to have to idea that everyone will love ads if they are more specifically targeted at you, based on data they have on file. I can’t stop them from doing that (other than by closing and deleting my account), but I shouldn’t have to see ads if I don’t want to IMHO. Also notice that the new facebook design and the old one use the same css classes for everything; the redesign isn’t that extensive apparently.

Update: see my post “Fixing Facebook with userContent.css” for a corrected and more extensive way to go about this. There are some stupid errors in this post that lead me to use a bad approach, but the greasemonkey script should still work.

I am not a huge fan of ads. I say that somewhat hypocritically as adSense proudly barfs somewhat random ads out on this page, none of which I really expect will ever click on, but that is besides the point ;). Anyway, I can normally block ads with adBlock, but social ads are trickier. Every social ad div has for a class:
feed_item clearfix social_ad
Each one is a seperate class. They do some trick so it is hard to override with a page wide css that doesn’t take out everything, so userContent.css and similar tricks are out. I ended up brute forcing it and writing a greasemonkey that does the job.

Download it here: hidefacebookfeedadsuser.js

Update: There is another class used as well. If I remember correctly, instead of social_ads, its ad_capsule with everything else the same.