background-color-multiple-real-content-subtree-root.html

<!DOCTYPE html>
<div style="position:relative;background-color: gray;">
  <div>Text that is NOT area selected.</div>
  <div>
    <div>More text that is NOT area selected.</div>
    <div style="background-color:red; color:purple; margin-top: 10px; margin-bottom: 10px;">
      Text that got area selected.
    </div>
  </div>
  <div style="margin-bottom: 10px;margin-top: 10px;">
    <div>some more text got area selected.</div>
  </div>
  <div>
    <div>some more more text got area selected.</div>
  </div>
  Text that is NOT area selected.
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<div style="position:relative;background-color: gray;">
  <div style="background-color:red; color:purple; margin-top: 10px; margin-bottom: 10px;">
    Text that got area selected.
  </div>
  <div>
    <div>some more text got area selected.</div>
  </div>
  <div style="margin-bottom: 10px;margin-top: 10px;">
    <div>some more text got area selected.</div>
  </div>
</div>