AdBlock plus hids elements with ids or class with the word "ad"

html css adblock
TDsouza picture TDsouza · Dec 29, 2012 · Viewed 12.6k times · Source

I have two divs in my site one with id ad_holder and another with id ad_buttons"

When testing the site on Mozilla with ad block plus installed I noticed that both divs were hidden. On further inspection I noticed it that Adblock was the culprit probably because of the ID names. I also noticed that Adblock created (or maybe has a ready made) CSS file, that sets the display to hidden.

I know I can fix this by simply changing the IDs or trying to override the Adblock CSS but still need to know if there is yet another alternative way of fixing this, like a small piece of code that tells Adblock it's not a real ad.

The contents of the divs are not real ads, it just holds .jpegs about the client's business.

Answer

a.s.panchenko picture a.s.panchenko · Nov 27, 2013

It's better to rename your classes and id's. I would say, that image names, directories also can cause accident disappearing. Solution is to avoid words like:

  • ad
  • ads
  • adv
  • advert
  • advertisement
  • banner
  • banners

Related questions

How to hide a background with AdBlock Plus filter

Some websites set a background image to advertise, e.g. <body style="background-image:url('images/adv.png')"> I'm wondering how I can write an AdBlock Plus filter in order to hide the <body> background.

Read More
How to horizontally center a <div>

How can I horizontally center a <div> within another <div> using CSS? <div id="outer"> <div id="inner">Foo foo</div> </div>

Read More
How do I vertically center text with CSS?

I have a <div> element which contains text and I want to align the contents of this <div> vertically center. Here is my <div> style: #box { height: 170px; width: 270px; background: #000; font-size: 48px; color: #…

Read More