IE 7 does not honor the clear:both sytle rule. So the container div’s height does not include the entire height of some divs that are floated left or right inside it.

As this seems to be a big common problems, there are too many people offer solutions, which I find are too complicated and somehow do not work. Took me much time to experiment with various possible solutions without much success, until I came across this post that suggested the simple solution that worked for me – that is, add the rule height:100% to the containing div, and that’s it.

  • Digg
  • del.icio.us
  • StumbleUpon
  • Sphinn
  • Facebook
  • Mixx
  • Google Bookmarks
  • Haohao
  • LinkedIn
  • Live
  • MyShare
  • MySpace
  • Reddit
  • Technorati
  • TwitThis

Related posts:

  1. IE’s Quirks with CSS Pseudo Class :hover
  2. Nonsecure Content Alert in IE
  3. IE Quirks with CSS Sprites
  4. Chinese Text Displays With Mixed Fonts

Tags: , , , , , ,

Leave a Reply

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">