Neat New Tags

I added a nifty little style to the tags on every post. Now they're all cool looking.

I did this with a little bit of CSS wizardry. Here's how you can achieve the same results!

The theory of this trick is to use a psuedo-element, fit it to the tag element's size, style the psuedo-element instead of the tag itself, and drop it behind the tag.

Assuming the tags have a class of "articleTag"...

.articleTag {
  position:relative;
  color:#000;
}

.articleTag::before {
  content: '';
  position:absolute;
  background:#f00;
  z-index:-1;
  top:0;
  right:0;
  bottom:0;
  left:0;
  transform:skew(25deg);
}