Set Offset to not attached div doesn’t work correctly in IE

We want to dynamically show an image below a span html element. 
The javascript creates a div element, than assigns new offsets using jQuery offset() and then appends the div to document.
It worked as expected in FireFox, but moved the new element to the bottom of the page in IE.
I found, that if I will call offset after document.body.appendChild, it will assign values correctly.

In the test page below if offset is called  after document.body.appendChild,
new img assigned left: -8, top: 110
img left: -8, top: 110  -expected
If offset is called  before document.body.appendChild,
new img assigned left: -8, top: 110
img left: 0, top: 214   -wrong

The test page OffsetAfterAppend.htm: <!
DOCTYPE html> <html> <head>     <script src="http://code.jquery.com/jquery-latest.js"></script> </head> <body>  <p style="height:"100px">Offsets to show</p>  <p id="currentP"> Hello <span id="curr" style="background-color:Green">span to be above the image </span></p>    <p></p>   <script>       var p = $("p:first");        var s = $("span:last");        var currentOffset = s.offset();        p.html("span left: " + currentOffset.left + ", top: " + currentOffset.top);            var currentHeight = 20;         YOffset = 40;       XOffset = -55;       sImageURL = "http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif";                  var divMapContainer = document.createElement('div');         var imgMap = document.createElement('img');         $(imgMap).attr('src', sImageURL);         $(imgMap).attr('alt''');         $(divMapContainer).append($(imgMap));         newLeft = currentOffset.left + XOffset;         newTop = currentOffset.top + currentHeight + YOffset;         p.html(p.html() + "<BR/>new img assigned left: " + newLeft + ", top: " + newTop);         //$(divMapContainer).offset({ top: newTop, left: newLeft });          document.body.appendChild(divMapContainer);          $(divMapContainer).offset({ top: newTop, left: newLeft });          var img = $("img:last"); var imgOffset = img.offset();          p.html(p.html() + "<BR/>img left: " + imgOffset.left + ", top: " + imgOffset.top)   </script> </body> </html>