CODEWITHSUNDEEP
htmlcsstwitteradblock
CaymanCarver
CaymanCarver

Reputation: 419

Adblockers hiding a CSS class that's not an ad

I've had several site visitors report missing bits of text. Turns out they have ad blockers installed, and the missing text is linked to post a tweet with a custom CSS class name. Here's a sample of what disappears:

<a href="https://twitter.com/intent/tweet?text=xxxx&amp;url=http%3A%2F%2Fxxxx" class="tweet_quote">The text that disappears.</a>

Here is the definition for the class tweet_quote:

.tweet_quote {
    color: black;
    text-decoration: none;
    background-image: url(images/Twitter_logo_blue_32.png);
    background-repeat: no-repeat;
    background-position: right;
    background-size: 20px 20px;
    transition: .2s;
    padding-right: 20px;
}
.tweet_quote:hover {
    color: white !important;
    background-color: #56aeec;
    background-image: url(images/Twitter_logo_white_32.png);
}

The Twitter_logo png is also blocked by the adblockers. The actual page URL is https://skeptoid.com/episodes/4516

Anyone see anything in there that might be triggering the ad blockers?

Upvotes: 0

Views: 156

Answers (1)

zzzzBov
zzzzBov

Reputation: 179086

Adblocks typically also block tracking widgets, which most social media sharing toolbars are.

tweet being in the class name is likely causing issues.

Upvotes: 2

Related Questions