title: Cross-browser alternative to CSS calc()
body: <p>The CSS <code>calc</code> method is not supported on Opera mini and IE 8. But this is such an essential method that I can't imagine that something equivalent doesn't exist for those browsers.</p>
  
  <p>Is there a universally supported way I can accomplish a div that has padding, but also fills the whole screen? Or is there a way I can make this code cross-browser?</p>
  
  <p><strong>html</strong></p>
  
  <pre><code>&lt;div class="this-should-fill-the-whole-screen"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>css</strong></p>
  
  <pre><code>.this-should-fill-the-whole-screen {
    padding: 20px;
    width: calc(100% - 40px);
    height: calc(100vh - 40px);
  }
  </code></pre>
  
  <p>Fiddle: <a href="http://jsfiddle.net/wfq6xLn5/" rel="nofollow">http://jsfiddle.net/wfq6xLn5/</a></p>