title: Regular expression that validates a CSS selector
body: <p>What is a regular expression that can be used to validate a CSS selector, and can do so in a way that a invalid selector halts quickly.</p>
  
  <p>Valid selectors:</p>
  
  <pre><code>EE
  #myid
  .class
  .class.anotherclass
  EE .class
  EE .class EEE.anotherclass
  EE[class="test"]
  .class[alt~="test"]
  #myid[alt="test"]
  EE:hover
  EE:first-child
  E[lang|="en"]:first-child
  EE#test .class&gt;.anotherclass
  EE#myid.classshit.anotherclass[class~="test"]:hover
  EE#myid.classshit.anotherclass[class="test"]:first-child EE.Xx:hover
  </code></pre>
  
  <p>Invalid selectors, e.g. contain extra whitespace at the end of the line:</p>
  
  <pre><code>EE:hover   EE
  EE .class EEE.anotherclass 
  EE#myid.classshit.anotherclass[class="test"]:first-child EE.Xx:hov     9
  EE#myid.classshit.anotherclass[class="test"]:first-child EE.Xx:hov  -daf
  </code></pre>