title: How to declare css "global" height? Inside the html file or inside the css file?
body: <p>My code is working, but I'm a bit confused. Somewhere I read about that if you want your site to fill the whole page regardless of the viewport, then you have to declare the <code>height: 100%</code> inside the html file rather than inside the css because of older browsers. Is it true?</p>
  
  <p>I don't have any problem with this solution other than it's looking ugly inside the html.</p>
  
  <pre><code>&lt;html style="height: 100%;"&gt;
  ...
  &lt;div class="wrapper" style="height: 100%;"&gt;
      &lt;div style="height: 100%;" class="side-nav"&gt;
          &lt;div class="nav-title"&gt;I am the title&lt;/div&gt;
      &lt;/div&gt;
      &lt;div style="height: 100%;" class="content"&gt;asd&lt;/div&gt;
      &lt;div style="height: 100%;" class="side-bar"&gt;asd&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I didn't know how to ask Google about this question and I didn't find the answer where I read about this setup. Please if you think it's off-topic, let me know and I'll delete, but I'm really curious.</p>
  
  <p><strong>UPDATE:</strong></p>
  
  <p>Just to not misleading, I know how to declare it inside css, I was just curious about that is there any difference between the two solutions. :)</p>
  
  <pre><code>html, body {
    margin: 0;
    padding: 0;
    width: auto;
    height: 100%;
  }
  
  .wrapper {
    overflow: hidden;
    background: #ccc;
    margin: 0 auto;
    height: 100%;
  }
  
  .side-nav, .content, .side-bar {
    float: left;
    height: 100%;
  }
  </code></pre>
  
  <p>It works the same, now I know.</p>