title: Remove blue box when rapidly clicking div
body: <p>There are a number of questions on here about getting rid of blue outlines/borders on click <code>&lt;a/&gt;</code> tags, <code>links</code> and <code>buttons</code> -   <a href="https://stackoverflow.com/questions/20340138/remove-blue-border-from-css-custom-styled-button-in-chrome">Remove blue border from css custom-styled button in Chrome</a>, for example - but what I wanted to know was is there a way of preventing an annoying blue boxes that sometimes appears when you click fairly rapidly on a <code>&lt;div&gt;</code> elememt?  </p>
  
  <pre><code>&lt;div class="img" style="left: -200%;"&gt;&lt;/div&gt;
  &lt;div class="img" style="left: -100%;"&gt;&lt;/div&gt;
  &lt;div class="img visible" style="left: 0%;"&gt;&lt;/div&gt;
  &lt;div class="img" style="left: 100%;"&gt;&lt;/div&gt;
  &lt;div class="img" style="left: 200%;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I've got 5 divs just like the ones above.  When the <code>div</code> with the class of <code>visible</code> is clicked, the class is removed and added to the next div in the list and the left values are adjusted etc etc.  When you click rapidly you sometimes get this annoying blue box that seems to attach itself to either the visible div or the one to the left or right of it.  </p>
  
  <p>Is clicking rapidly almost like your selecting the divs?</p>
  
  <p>I'm not sure what this box would be called so, if you can can you target it using css and disable it?   </p>