title: CSS Relative positioning overflow (squashed div problem) divs height expand with content?
body: <p>I'm trying to edit some css to include a border to the right and the left of my site. My problem is that when I make my height 100% or auto nothing happens, but when I change the height it works, but I can't use this as I want it to change with the content.</p>
  
  <p>I've noticed in expression web my sitegrinder div looks too squashed up the top instead of the full length of the content. Could this be due to positioning? Could overflow fix this somehow? </p>
  
  <p>I have included the css and html below</p>
  
  <pre><code>  &lt;div  id="sitegrinder"&gt;
      &lt;div id="bgrepeat"&gt;
             &lt;div id="id68logo"&gt;&lt;/div&gt;
                    &lt;div id="bglight"&gt;&lt;/div&gt;
                          &lt;div id="topbanner"&gt;&lt;/div&gt;
                                 &lt;div id="id53light"&gt;&lt;/div&gt;
  
  
  #sitegrinder  {
  left: auto;
  top:auto;
  width: 960px;
  position: relative;
  margin:auto;  }
  </code></pre>
  
  <p>I've also noticed that when I include overflow:hidden within the css all my content appears squashed at the top within this div.</p>