title: html element making whole web app selectable?
body: <p>I have most of my web-app set as unselectable. Using div as an example:</p>
  
  <pre><code>div {
      -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  }
  </code></pre>
  
  <p>The amazing thing is that I can still select most of the page by starting the select along the left edge-- the DOM inspector tells me I'm selecting <em>outside</em> of any DOM element itself, and am selecting from inside the top level HTML element. I tried being silly and setting it as:</p>
  
  <pre><code>html {
      -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  }
  </code></pre>
  
  <p>...which yielded no effect. I'm being a perfectionist here, but at this point I'm just curious-- how can you disable this entirely? The body is already 100% width. I don't understand why I can click outside it.</p>
  
  <p>Also, this only happens in Firefox.</p>