title: HTML Disabled Button getting :active CSS Pseudo Class
body: <p>CSS:</p>
  
  <pre><code>button:active {
  /* active css */
  }
  
  button:disabled {
    opacity: 0.5;
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;button disabled="disabled"&gt;Ok&lt;/button&gt;
  </code></pre>
  
  <p>When I click the button the browser adds the button:active state making it look like it was clicked (even though it is disabled). I swear I thought :active was only added if the button was enabled.  What have I missed?</p>