title: CSS margin-top on inner div pushing parent div down
body: <p>I am trying to push the child div down 5px inside of the parent div. When I put <strong>margin-top:5px;</strong> on the inner div it pushes down both the inner div and the parent div from the div above the parent div, but does not push the inner div down from the parent div. How to I set it so that only the inner div is pushed down 5px from the parent div? I do not want the parent div to push down from the div above it. Thanks for any help.</p>
  
  <p>html for Navigation:</p>
  
  <pre><code>&lt;nav&gt;
      &lt;div class="nav-container"&gt;
        &lt;div id="cat_14623_divs"&gt;
            &lt;ul id="nav_14623"&gt;
                &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;AKINA &amp;amp; RED LAKE&lt;/a&lt;/li&gt;       
                &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;FRESH WILD CAUGHT FISH&lt;/a&gt;
                     &lt;ul id="navsub_14623_2326"&gt;
                         &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;WALLEYE&lt;/a&gt;&lt;/li&gt;
                         &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;PERCH&lt;/a&gt;&lt;/li&gt;
                         &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;CRAPPIE&lt;/a&gt;&lt;/li&gt;
                         &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;NORTHERN&lt;/a&gt;&lt;/li&gt;
                         &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;WHITEFISH&lt;/a&gt;&lt;/li&gt;
                    &lt;/ul&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;NEWS FROM THE FISHERY&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="#" onclick="return false;"&gt;CONTACT US&lt;/a&gt;&lt;/li&gt;
                &lt;li class="last"&gt;&lt;a href="#" onclick="return false;"&gt;FAQs&lt;/a&gt;&lt;/li&gt;
           &lt;/ul&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p>CSS for Navigation:</p>
  
  <pre><code>nav{
  position:relative;
  width:960px;
  background-color:#660000;
  height:40px;
  }
  
  div.nav-container{
  position:relative;
  width:100%; 
  }
  
  #cat_14623_divs{
  margin-top:5px;
  height:30px;
  background-color:#520000;
  width:960px;    
  }
  
  #nav_14623{
  list-style:none;
  display:block;
  padding:0;
  width:80%;
  margin:0 auto;
  }
  
  #nav_14623 li{
  position:relative;
  float:left;
  padding: 0.5em 1.5em;
  margin: 0px;
  font-size:12px;
  border-right:solid 2px #fff;
  text-align:center;  
  }
  
  #nav_14623 li.last{
  border-right:none;
  padding-right:5px;
  }
  
  #nav_14623 li a{
  color:#FFF;
  text-decoration:none;
  }
  
  #nav_14623 ul{
  position: absolute;
  left:0;
  top: 100%;
  display: none;
      padding: 0 1000em; /* trick from css-tricks comments */
      margin: 0 -1000em; /* trick from css-tricks comments */
  list-style: none;
  margin-left: 0px;
  margin: 0;
  padding: 5px;
  width:200px;
  z-index: 1000;
  background: #660000;
      border-left: 1px solid #336699;
      border-right: 1px solid #336699;
      border-bottom: 1px solid #336699;
      border-top: none;
   }
  
  #nav_14623 ul li{
  position: relative;
  float: none;
  border-right: none;
  padding:0;
  margin: 0;
  }
  
  #nav_14623 ul li a{
  color: #fff;
  font-size: 12px;
  vertical-align: middle;
  line-height:32px;
  width: 100%;
  height:35px;
  display:block;
  }
  
  #nav_14623 ul li a:hover{
  background: #520000;
  width: 100%;
  }
  
  #nav_14623 li:hover &gt; ul{
  display: block;
  }
  
  #nav_14623:after {
  content: ""; clear: both; display: block;
  }
  </code></pre>
  
  <p>Here is the url in case you want to see the site:
  <a href="http://redlakewalleye.designangler.com/" rel="nofollow">http://redlakewalleye.designangler.com/</a></p>