Relative Positioned Container Div Not Expanding to Absolutely Position

[g123s]

Hi,

I've positioned my container div relative. In the container, I then positioned my center content div absolute.

The problem: The container div is not expanding with the content div. You can see this because the content div is overlapping my footer which is clear: both.

You can check out my website: www.2teachreading.comyr.com

Thanks

[mrG]

Try making it static instead and using margin-left instead of left:

.container .content {
	width: 640px;
	position: static;
	margin-left: 170px;
	background-color: #6633CC;
}

Then move the "content" div to after the left and right sidebars:

  <div class="contentwrapper">
    <div class="rightnavbar">
      <ul><li><a href="http://www.google.ca">Glycemic Index </a></li>
        <li><a href="http://www.google.ca">Google</a></li>

      </ul>
    </div>
    <div class="leftsidebar">
     
     <img src="images/160x600.gif" />
    </div>
	
    <div class="content">
      <h4>Helloafdafasf</h4>
         [...]
	  <p>&nbsp;</p>
	  <p>&nbsp; </p>
    </div>	
  </div>

See: http://g-prime.net/misc/2teachreading.html

[g123s]

Thanks for your efforts, but I have one more question. Why doesn't absolute positioning work? If I used the z-index would it work? Why is there space between the columns and header?

Also, I don't really want to change the order of the code, because, Google, always says that you should have your content at the top of the source code. I just want the content div to be under the header in the source code.

Oh yeah, mrG, are you a PHP developer? I need to hire one for my website, dinehere.ca

[g123s]

I'm not that good with CSS.