title: padding/margin bottom not working, i want to understand why
body: <p>I have a header element in a header div but for some reason i can't seem to add any bottom margin or padding to it. Margin/padding top, left, and right work find however. is there a reason for this? here is my code.</p>
  
  <p>html</p>
  
  <pre><code>&lt;div id="Container"&gt;
  &lt;div id="Header"&gt;  
     &lt;h1&gt;My Webpage&lt;/h1&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>#Container {
  
  position: relative;
  width: 96%;
  height: 98%;
  left:2%;
  background-color: black;
  border-radius: 10px;
  box-shadow: 0px 0px 15px 5px;
  
  }
  </code></pre>
  
  <p>/<em>----------------------------------------</em>/</p>
  
  <pre><code>#Header {
  
  position: absolute;
  height: 15%;
  width: 100%;
  /*background-color: red;*/
  border-bottom: 2px solid #e8e2e2;
  
  }
  
  #Header h1 {
  
  font-size: 2.5em;
  text-align: center;
  color:#e8e2e2;
  /*background-color: red;*/
  
  }
  </code></pre>