Why does sidebar float to bottom in IE6 and IE7?

what do i need to do to ensure that the sidebar is even with the main content div rather than floating to the bottom as seen in IE6 and 7?

 

Is there a link to the page?

 

here you go; http://sachitesting.com/

 

Is there any reason why you didnt validate the page?

 

Not tested.

I believe it's caused by this bit:

#contentcontainer {
	width: 950px;
	margin-top: 20px;
	line-height: 150%;
	clear: both;
	}

Code (markup):

HasLayout is triggered by the width property. Try it this way:

#contentcontainer {
  margin-top: 20px;
  line-height: 150%;
  clear: both;  /*what does this do?  If you lack compelling reason for it, remove it.*/
  }

Code (markup):

Soulscratch makes a point. You do have some serious syntax errors, eg. a 'p' nested in another 'p', that I saw a quick glance.

cheers,

gary

 

This appears a lot with other websites too when I'm using IE6. Validating is key and coding it in XHTMl 1.0 transitional.

 

Why would you use deprecated elements or attributes in any new document? Always write code that validates to strict standards.

The #1 cause for IE grief (aside from outright non-support) is IE's implementation of hasLayout. IE has made hasLayout pervasive to the extent that it is difficult to avoid. It is a poor attempt to create the standards compliant "formatting context". An understanding of hasLayout and its effects is critical to (fairly) bug-free IE rendering.

cheers,

gary

 

Coding in XHTML won't make your layout any more cross-browser compatible than HTML 4.01 Strict.

 

Yep- KK5ST is right- it is a haslayout issue. I'll have to look more indepth about haslayout but it came from me defining a width for the container. I can take out the width or just set it to auto and the sidebar will be in it's proper position.

Thx!

 

Ingo Chao has written, edits and maintains what is probably the most comprehensive resource, On having layout—the concept of hasLayout in IE/Win, available. It is extremely current with any new information, and far surpasses MSFT's documentation. Plus, it's actually readable by non-über-geeks.

cheers,

gary

 

Here's a shorter version by Zoffix

zoffix.com/css/ie/haslayout.shtml