1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Why does sidebar float to bottom in IE6 and IE7?

Discussion in 'CSS' started by driven, May 8, 2007.

  1. #1
    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?
     
    driven, May 8, 2007 IP
  2. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #2
    Is there a link to the page?
     
    soulscratch, May 8, 2007 IP
  3. driven

    driven Well-Known Member

    Messages:
    400
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    138
    #3
    driven, May 8, 2007 IP
  4. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #4
    Is there any reason why you didnt validate the page?
     
    soulscratch, May 8, 2007 IP
  5. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #5
    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
     
    kk5st, May 9, 2007 IP
  6. 8everything

    8everything Peon

    Messages:
    16,350
    Likes Received:
    903
    Best Answers:
    0
    Trophy Points:
    0
    #6
    This appears a lot with other websites too when I'm using IE6. Validating is key and coding it in XHTMl 1.0 transitional.
     
    8everything, May 9, 2007 IP
  7. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #7
    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
     
    kk5st, May 9, 2007 IP
  8. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #8
    Coding in XHTML won't make your layout any more cross-browser compatible than HTML 4.01 Strict.
     
    soulscratch, May 9, 2007 IP
    driven likes this.
  9. driven

    driven Well-Known Member

    Messages:
    400
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    138
    #9
    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!

     
    driven, May 10, 2007 IP
  10. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #10
    kk5st, May 10, 2007 IP
  11. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #11
    Here's a shorter version by Zoffix

    zoffix.com/css/ie/haslayout.shtml
     
    soulscratch, May 10, 2007 IP