<h2>Adding pseudo-elements to meta tags and link elements</h2>

<p>The elements above are meta tags and link elements, in the head of the document. These are void elements (no closing tag) but you can add pseudo-elements to them.</p>
  
<p class="p">Demo by Louis Lazaris. <a href="http://www.sitepoint.com/12-little-known-css-facts-the-sequel" target="_blank">See article</a>.</p>

body {
  text-align: center;
  padding: 0 20px;
}

head {
  display: block;
}

meta, link {
  display: block;
  background: lightpink;
  border: solid 1px;
  padding: 14px;
  margin: 10px;
}

link:before {
  content: "This is a link (stylesheet) element";
}

meta:before {
  content: "This is a meta element";
}

p {
  max-width: 700px;
  margin: auto;
}

.p {
  font-family: Arial, sans-serif;
  font-size: 14px;
  padding-top: 130px;
}