title: Can I target a :before or :after pseudo-element with a sibling combinator?
body: <p>Is there a reason why this CSS doesn't work?</p>
  
  <p><a href="http://jsfiddle.net/6v5BZ/" rel="noreferrer">http://jsfiddle.net/6v5BZ/</a></p>
  
  <pre class="lang-css prettyprint-override"><code>a[href^="http"]:after {
      content:"";
      width:10px;
      height:10px;
      display:inline-block;
      background-color:red;
  }
  
  a[href^="http"] img ~ :after {
      display:none;
  }
  </code></pre>
  
  <p>.. on this HTML?</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;a href="http://google.com"&gt;Test&lt;/a&gt;
  &lt;a href="http://google.com"&gt;
      &lt;img src="https://www.google.com/logos/classicplus.png"&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>The idea is to have a pseudo-element on matching anchor tags. But I do not want it to apply to anchor tags that wrap an image. And since I can't target anchors using something like <code>a &lt; img</code>, I figured the maybe I could target the :after pseudo-element by finding an image that it's a sibling of.</p>
  
  <p>Any insight would be greatly appreciated.</p>