title: Can not get the div margin-top to work
body: <p>I'm trying to create a basic layout, where you have a header, a left col, content area, and the right col. When I'm setting the margin-top of the leftmenu (left col), it's not pushing the div down. I want the div to be under the header and have a border around it.</p>
  
  <p>The maring-top for the .leftmenu is not working. I wan this to have a border under the header div.</p>
  
  <p>CSS</p>
  
  <pre><code>   body
     {
      position:absolute;
      top:0px;
      left:0px;
      margin:0px;
      background-color:yellow;
     }
     .header
     {
      background-color:#b0c4de;
      border: 0px solid black;
      position:absolute;
      top:0px;
      left:0px;
      width:100%;
     }
     .topmenu
     {
      margin-top:100px;
     }
     .topmenu ul
     {
              margin-left:280px;
              margin-bottom:2px;  
              width:800px;
     }
     .topmenu li
     {
       display:inline;
       width:120px;
       border:1px solid green;
       margin-left:8px;
       padding:4px;
       text-align:center;
     }
  
     .topmenu li a
     {
      border : 0px;
      text-decoration:none;
     }
     .leftmenu
     {
      height:100%;
      border:1px solid black;
      width:200px;
      padding-top:150px;
      margin-top:150px;
     }
     .leftmenu ul
     {
      list-style-type: none;
      margin:0px;
      margin-left:3px;
     }
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code> &lt;body&gt;
      &lt;div class="header"&gt;
          &lt;div class="topmenu"&gt;
              &lt;ul&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link1&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link2&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link3&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link4&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link5&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link6&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="leftmenu"&gt;
              &lt;ul&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link1&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link2&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Some Link3&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="content"&gt;
          &amp;nbsp;
      &lt;/div&gt;
      &lt;div class="rightmenu"&gt;
                  &lt;ul&gt;
                      &lt;li&gt;&lt;a href="#"&gt;Some Link1&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;Some Link2&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;Some Link3&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
      &lt;/div&gt;
   &lt;/body&gt;
  </code></pre>
  
  <p>See Fiddle <a href="http://jsfiddle.net/XBxNs/" rel="nofollow">http://jsfiddle.net/XBxNs/</a></p>