title: background-color of dashed borders
body: <p>I currently have a HTML structure like this:</p>
  
  <pre><code>&lt;div id="holder"&gt;
      &lt;div id="content"&gt;...&lt;/div&gt;
      &lt;div id="footer"&gt;...&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The CSS is like this:</p>
  
  <pre><code>* {
      margin: 0;
      padding: 0;
  }
  
  #content, #footer {
      background: #fff;
  }
  
  #footer {
      border-top: 1px dashed #ddd;
  }
  </code></pre>
  
  <p><strong>Note:</strong> <code>holder</code> doesn't have any <code>background-color</code></p>
  
  <hr>
  
  <p>My concern is that the background of the top border on the <code>footer</code> will be transparent since <code>holder</code> doesn't have any background.</p>
  
  <p>And applying a white background to the <code>holder</code> is not an option in my case (I won't explain why not, but trust me, it is not possible)</p>
  
  <p><strong>My Question:</strong></p>
  
  <ul>
  <li>The background of the dashed border will be the same of my <code>footer</code>
  (white) or the background-color of <code>holder</code> (none)?</li>
  <li>Will it behave cross-browser the same way all the time?</li>
  </ul>