title: Margin Issue With Extra Large Block Element
body: <p><strong>The Margin Issue</strong><br>
  I am working with extra large block elements (2000-4000px for both width and height) and most of these elements overflow the window/viewport. That is fine and  is the intended effect of my application. However, when I apply margin to the element on all sides, say 40px, it is applied only to the top, left, and bottom sides. The far right edge is flush with the edge of the window after scrolling over. I am looking to have an even margin on all sides of the block element. </p>
  
  <p><strong>The Code</strong><br>
  See below or <a href="http://jsfiddle.net/utmkq/">view this jsFiddle</a> of a reduced test case.
  </p>
  
  <pre><code>&lt;!-- HTML --&gt;
  
  &lt;div&gt;&lt;/div&gt;
  </code></pre>
  
  <pre class="lang-css prettyprint-override"><code>/* CSS */
  
  * {
      margin: 0;
      padding: 0;    
  }
  
  div {
      background: #000;
      height: 3000px;
      margin: 40px;
      width: 3000px;    
  }​
  </code></pre>
  
  <p><strong>What I Have Tried</strong><br>
  I have tried the above method, which I initially assumed would work, but it didn't. I have also tried applying a padding of 40px to the body element, and removing the margin from the div altogether, but got the same result. The same was true for a containing element with padding applied.</p>
  
  <p>Any help would be greatly appreciated. Thanks!</p>