title: Which elements support the ::before and ::after pseudo-elements?
body: <p>I'm trying to come up with some good default styling for <code>&lt;input&gt;</code>s in HTML5 and tried the following:</p>
  
  <pre><code>input::after         { display: inline; }
  input:valid::after   { content: ' ✓ '; color: #ddf0dd; }
  input:invalid::after { content: ' ✗ '; color: #f0dddd; }
  </code></pre>
  
  <p>Alas, the <code>::after</code> content never shows up. It's not a problem with double- versus single colons for the pseudo-elements; I've tried both. It's also not a problem with having a pseudo-element and a pseudo-class; I've tried it without the <code>:valid</code> and <code>:invalid</code>. I get the same behavior in Chrome, Safari, and Firefox (Firefox doesn't have the <code>:valid</code> and <code>:invalid</code> pseudo-classes, but I tried it without those.)</p>
  
  <p>The pseudo-elements work fine on <code>&lt;div&gt;</code>, <code>&lt;span&gt;</code>, <code>&lt;p&gt;</code>, and <code>&lt;q&gt;</code> elements -- some of which are block elements and some are inline.</p>
  
  <p>So, my question is: why do browsers agree that <code>&lt;input&gt;</code>s don't have an <code>::after</code>? I can't find anything in the spec that would indicate this.</p>