title: Selection area: bound by div and change it's color for all elements
body: <p>I am new to HTML/CSS and I faced with two troubles with elements selection.</p>
  
  <p>I write a html page, which contains a centered div and elements inside it.</p>
  
  <p>I have two troubles:</p>
  
  <ol>
  <li>How to bound selection area by div borders?</li>
  <li>Some elements use "old" selection color, how to change it?</li>
  </ol>
  
  <hr>
  
  <p>I placed two images below for better understanding what I mean:</p>
  
  <p>without selection:
  <img src="https://i.stack.imgur.com/8Bgqe.png" alt="without selection"></p>
  
  <p>with selection:
  <img src="https://i.stack.imgur.com/HgVFZ.png" alt="with selection"></p>
  
  <hr>
  
  <p>I tried to change selection background color by following peace of css code:</p>
  
  <pre><code>*::selection {
  color: #330066;
  background:yellow;
  }
  
  *::-moz-selection {
  color: #330066;
  background:yellow;
  }
  </code></pre>
  
  <hr>
  
  <p>[EDIT]:
  You can see a similar code here: <a href="http://jsfiddle.net/phvoronov/7ZQ5z/1/" rel="nofollow noreferrer">http://jsfiddle.net/phvoronov/7ZQ5z/1/</a>.</p>