title: CSS pseudoelement "after"
body: <p>I'm trying to use two pseudoelements <code>:after</code>, but only the first one is working:</p>
  
  <pre><code>[data-msgcounter]:after {
      background-color: #FF6969;
      background-image: -webkit-linear-gradient(#FF6969 0%, #ff0000 100%);
      background-image: -moz-linear-gradient(#FF6969 0%, #ff0000 100%);
      background-image: -o-linear-gradient(#FF6969 0%, #ff0000 100%);
      background-image: -ms-linear-gradient(#FF6969 0%, #ff0000 100%);
      background-image: linear-gradient(#FF6969 0%, #ff0000 100%);
      content: attr(data-msgcounter);
  }​
  
  [data-notcounter]:after {
      background-color: #FF6969;
      background-image: -webkit-linear-gradient(#FF6969 0%, #ff0000 100%);
      background-image: -moz-linear-gradient(#FF6969 0%, #ff0000 100%);
      background-image: -o-linear-gradient(#FF6969 0%, #ff0000 100%);
      background-image: -ms-linear-gradient(#FF6969 0%, #ff0000 100%);
      background-image: linear-gradient(#FF6969 0%, #ff0000 100%);
      content: attr(data-notcounter);
  }​
  </code></pre>
  
  <p>Anyone have tips or a solution?</p>