IE 8 Height not being calculated after element is expanded.
# March 10, 2010 at 4:51 am
I’ve just launched a new site and I have expandable and collapsible items in a list, in both IE6 and 7 the functionality of this works well but no so in IE 8.. please visit: http://j.mp/a1aqz0 , click on a book genre (Fiction/Non-fiction), a book list will appearto the right of it. These books can be expanded to show more detail but IE 8 does not seem to account for this change in height and so the items at the bottom of the list are cut-off and unreadable. If a user clicked the expand all button, then most of the items in the list would be cut-off.
I have tried quote a few different solutions to no avail so I welcome any and all ideas.
Also, I have purposely not named or linked to the website directly because I do not want this page to be in a search results page when searching for this particular website.
Many thanks in advance.# March 11, 2010 at 7:51 am
Thanks Noah, I have nearly got it to work. It seems it might’ve been down to my choice of float clearing, I have updated it using Jeff Starr’s new clearfix code which now seems to get it to almost work. The footer is now masked behind the expanding content making it unreadable.
This is causing me much annoyance because I cannot believe that IE 6 and 7 render this correctly but IE 8 does not.
BTW, overflow:hidden was removed on the .column and .row and clear:both added to the footer..
If you have any thoughts on the footer I would love to hear them.
Thanks again.# March 11, 2010 at 11:18 am
This reply has been reported for inappropriate content.
If you are not too much of a perfectionist you can always use an IE emulate so that IE8 acts like IE7.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> (for XHTML)
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" > (for HTML)
It must be immediately after the <head> tag, not lower down the head section.
You must be logged in to reply to this topic.