title: How to position a div in accordance to another div's margin?
body: <p>I have got two divs.</p>
  
  <pre><code>&lt;div class="header"&gt;&lt;/div&gt;
  
  &lt;div class="container"&gt;
  &lt;p&gt;This is the container.&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And this is the css code.</p>
  
  <pre><code>.header{
      width:100%;
      height:100px;
      position:fixed;
      background-color:#eee;
  }
  .container{
      margin:0 auto;
      margin-top:100px;
      margin-bottom:100px;
  }
  </code></pre>
  
  <p>Why does the header come down, even though I have put a margin top on the container? Can someone suggest me a way to have a fixed header along with the rest of the stuff in container just like any other usual page?</p>