title: Background color does not show up when scrolling to the right
body: <p>I have the following simple HTML and CSS:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div style="width: 970px;"&gt;Text area&lt;/div&gt;
      &lt;div style="height: 20px; background-color:gray; width: 100%; "&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I load this page in a browser. If the width of the browser is 400px (just an example), then I see a horizontal scroll bar in the browser screen bottom. If I move the scroll bar to the right, I can see that the background of the second div does not extend to the right. </p>
  
  <p><strong>I hope that the background color of the second div can extend from browser's left edge to the right edge (no matter what the width of the browser is).</strong></p>
  
  <p>How can I fix this?</p>
  
  <p>Thanks!</p>