CSS and rel=sponsored
Examples to mark rel=sponsored links with CSS.
Sponsored links are also known as “affiliate links” and often marked with (A)
. Unfortunately, some sites do not mark them at all.
[rel=sponsored]:after {
content: " (A)";
}
[rel=sponsored]:after {
content: " (A)";
font-variant-position: super;
}
[rel=sponsored]:after {
content: " (A)";
font-size: .75em;
font-variant-position: super;
}
[rel=sponsored]:after {
content: "(A)";
font-variant-position: super;
margin-left: .25em;
}
[rel=sponsored] {
position: relative;
}
[rel=sponsored]:after {
content: "(A)";
font-size: .75em;
position: absolute;
right: 1.25em;
top: -0.25em;
}
<a href="https://www.dreamhost.com/r.cgi?240827" rel="nofollow sponsored">Dreamhost</a>
<style>
[rel=sponsored] {
position: relative;
}
[rel=sponsored]:after {
content: "(A)";
font-size: .75em;
position: absolute;
right: 1.25em;
top: -0.25em;
}
</style>
<a href="https://www.dreamhost.com/r.cgi?240827" rel="nofollow sponsored">Dreamhost</a>
<style>
[rel~=sponsored] {
position: relative;
}
[rel~=sponsored]:after {
content: "(A)";
font-size: .75em;
position: absolute;
right: 1.25em;
top: -0.25em;
}
</style>
(A) = Affiliate Link