Internet Explorer CSS Problem
Question
This page is being rendered incorrectly by IE 9 (and probably older versions too). The right menu is floating to the bottom of the page. Firefox, Chrome and Safari are rendering it correctly. Other pages in the blog are also being rendered fine by all browsers. I already tried to fire IE 9 Developer Tools (F12) and reduce the width of some divs (such as #main and .columns-inner)... no lucky with this approach, even with extra space the right menu is still rendered at the bottom. So I figure that the problem is in the Blogger auto-generated tags / css for the page content (which I am able to modify). Any CSS gurus out there can point what is wrong?
Cheers,
4 answers
solution1
4 2011-04-25 00:17:27
You have this line in your <head> , which is causing IE9 to render the page in IE7 mode:
<META content=IE=EmulateIE7 http-equiv=X-UA-Compatible>
If you remove this, it renders fine in IE8 and IE9. It still renders poorly in IE7, though.
Edit:
In response to your comment, I am able to replicate the issue with the background no longer being opaque. After some investigation, there is a particular script file being loaded:
http://www.blogger.com/static/v1/jsbin/938506610-ieretrofit.js
If you remove the <meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/> on line 4 of the source, and you remove the ieretrofit.js file from line 1471 of the source, the page should render correctly in IE9.
Since the ieretrofit.js file appears to be generated by Google, you might want to ask them about it. If you would like to disable it JUST for IE9, and allow it to continue for IE8 and below, you should take a closer look at line 1471 of the source. Here is a snippet (it's quite long, this starts around character #2275):
'\74!--[if IE]\76\74script
The !--[if IE] there is part of an IE conditional comment . You can change that snippet like so, and it will still target IE8 and below, without affecting IE9:
'\74!--[if lte IE 8]\76\74script
Let me know if you have any further issues!
solution2
2 ACCPTED 2011-04-25 00:17:54
该页面上有104个验证错误 -如果是您，我将首先修复这些错误 。
solution3
1 2011-04-25 00:16:42
Almost certainly it is because the page is invalid . Also, I really would think about starting again with this page as it is overly complex markup.
solution4
0 2011-04-25 01:29:43
Guys. Figured it out (with great help from andyb and Paul D.) The validator pointed to some unpaired </div> tags that I removed. Now it is working flawless.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.