9

This is one of those "what the bloody hell" problems that I don't even know how to approach.

I have this website: http://www.mojalbum.com and if you open it in IE8 it loads fine, and after half a second the layout gets messed up. If you then resize the window it gets back to normal. Also if you open developer tools and disable and re-enable a CSS property (does not matter which one) the layout gets fixed too.

Unfortunately I can't remember when this started happening so I don't know what I did that caused this. And I really have no idea what to do. I've spent 3 hours searching for a solution on google without any luck (to be honest I'm not really sure what to search for).

Here is the messed-up screenshot: enter image description here

And this is how it should look: enter image description here

I'm using Internet Explorer 8 (v 8.0.7601.17514) on Windows 7.

Edit: I've now managed to (kinda) isolate the problem. If jQuery (v1.6.1) is included on the page then this thing happens. Including jQuery v1.3.2 does not cause this problem.

Improve this question
1
  • 2
    The site does have HTML and CSS validation errors. Perhaps cleaning those up will result in a fix? Good luck.
    – Brock Adams
    Commented May 27, 2011 at 9:06

2 Answers 2

Reset to default
11

The answer below is now mostly obsolete, because the problem has been fixed as of jQuery 1.6.2, which has been out for a while now.

If you're having this problem, just upgrade jQuery to the newest available version.

Edit:

There's something wrong with jQuery!

If I switch to 1.6.1 hosted from Google, it still breaks: http://jsbin.com/epata3/3

If I move the script to inside the head, it works: http://jsbin.com/epata3/4

And you're right, everything works as expected with 1.6.0: http://jsbin.com/epata3/7

???

There's something wrong with your jQuery include.

This simple test case breaks in IE8 in exactly the same way:

See in IE8: http://jsbin.com/exomi4

The background flashes red, then turns white.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>

<style>
body {
    background-color: red;
}
</style>

</head>
<body>
<script type="text/javascript" src="http://www.mojalbum.com/js.php?f=core/jquery_1.6.1.js,&c=v2"></script>
</body>
</html>
Improve this answer
3
  • Yep, very very wired. I'll use your example to fill a bug report if you don't mind.
    – Jan Hančič
    Commented May 27, 2011 at 10:58
  • Good idea. I'm interested to hear what the cause of this is.
    – thirtydot
    Commented May 27, 2011 at 11:27
  • 2
    The bug has been fixed for the next release (1.6.2), you can get the fixed version here: code.jquery.com/jquery-git.js
    – Jan Hančič
    Commented May 30, 2011 at 7:30
2

I've reverted the jQuery version back to 1.6 (from 1.6.1). This fixed the issue.

Improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.