IE8 annoying me possible even more than IE6

Got up this morning about 8.15am and it was cloudy outside. It stayed cloudy and rainy all day. After a shower etc. and breakfast I checked my email, hotukdeals, andy rouse's blog and deviantart.

After that I checked my site on IE8 and first thing I noticed was the layout was broken, the adverts box had quite a large margin on its right hand side, and was overlapping with the content text. This was quite easy to fix though, just by setting a left margin for the advert box. However, I thought IE8 was meant to be standards compliant and would work the same as Firefox, Opera and Safari.

Next I noticed that a checkbox on the login form wasn't aligned with the label text correctly in all the IEs, so I fixed that with a negative top margin. So now I have 5 stylesheets - standard, IE6, IE7, IE8, IE-all. The IE-all sheet is not strictly neceasary as I could put the rule in each of the seperate IE stylesheets, but it makes it easier for me to have an IE-all sheet.

Then I discovered a major problem with my site in IE8 - the lightbox function would just make the screen turn black (rather than darkening the screen and displaying an image). After quite a bit of testing to try and find out why the image wasn't appearing I decided to try and fix the solid black background in case the image was being hidden behind the lightbox background. I did some searching on google for opacity in IE8 and found that you need to either put

filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

or

ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

Both worked for me, so I have used the top one. I found that the image still wasn't apprearing. I did lots more testing and found that even if I applied sizing to the image, its offsetWidth was always 0.

I checked whether my code (including code generated via javascript) validated and it didn't. There were 2 problems - the lightbox image needed to be inside a container, rather than just appended to the body, and it needed an alt attribute. So I fixed this, the page validated, but still the same problem in IE8.

After much messing around, deleting and adding code, writing test pages etc. I finally found the problem was due to the lightbox background having 'position: fixed'. But without 'position: fixed' the background didn't appear at all. So I tried changing the javascript code so that the lightbox background was appended to the document hierarchy after the lightbox image container, and this fixed it - I now had both the image and background appearing in IE8. However, the image wasn't being centred in the screen correctly.

So next I did some messing about with the code trying to fix this problem, and it seems the problem is due to IE8 reporting a very small page height.

I tried the following, and all are very small, much less than the actual page height:

alert('window.innerHeight' + window.innerHeight + '\n'
+ 'document.body.clientHeight' + document.body.clientHeight + '\n'
+ 'document.documentElement.clientHeight' + document.documentElement.clientHeight + '\n'
+ 'window.scrollMaxY' + window.scrollMaxY + '\n'
+ 'document.body.scrollHeight' + document.body.scrollHeight + '\n'
+ 'document.documentElement.scrollHeight' + document.documentElement.scrollHeight + '\n'
+ 'document.body.offsetHeight' + document.body.offsetHeight + '\n'
+ 'document.documentElement.offsetHeight' + document.documentElement.offsetHeight);

The VHD of IE8 came with a developers tools program, which can show you the outline of various elements, so I highlighted the body and it is really small. I guess everything else on the page must be overflowing out of it.
I tried setting the body height to 100%, but it was still really small, it reached to nearly the bottom of the window when you were scrolled up to the top of the page. If I tried highlighting the HTML, this seemed to highlight the whole page. So I tried 'document.body.parentNode.offsetHeight', but this still gave a very small figure (possibly the window height). I did some googling but couldn't see anything about how to get the pageHeight in IE8. You can also see in the above image that IE8 messes up the login form if you scroll the page at all.

Trying to get these things working in IE8 took me from about 9.30am until about 5.30pm. I had a look on the MS webpages about IE8, but couldn't see anything about how near to release the beta2 (which I'm testing on) is meant to be, or when a release candidate or final version will be released.

Something weird I noticed when logging onto Blogger was that it said 'connecting to noetic.org'. No idea why it wanted to connect there, I couldn't see any links to them or anything on the landing page.

After dinner I checked my email and hotukdeals again and then watched an episode of Lost. Then I read various threads and the Pentax 50/1.4 review on dpreview.

Food
Breakfast: Coco pops; orange juice.
Lunch: 2x cheese on toasts; white grapes; satsuma; slice of iced lemon madeira layer cake; chocolate digestive biscuit bar; cup o' tea; Roses.
Dinner: Slice of pepperoni pizza; green beans; chips; salt. Pudding was a small cherry bakewell tart with custard. Coffee; Roses.

MS Virtual PC 2007

I spent most of today watching a Bob Dylan documentary and a pink panther film. The Dylan documentary was quite good, although it only covered a few years of his life, something like 1960-1966. Would have been more interesting if it had covered all his life up to now. It had some clips of performances by other good artists that me and yumpt had nae heard of, so we wrote them down as we watched the film:

• Gene Vincent and the blue caps
• Muddy Waters
• Woody Guthrie
• The new lost City Ramblers
• Howlin' Wolf

I also downloaded Microsoft Virtual PC 2007 as using VMWare I have been unable to connect to my PC's localhost. After downloading it I found I already had it installed, so I installed win XP on it, and then found that MS actually provide virtual hard disk images pre-loaded with Win XP SP2 and IE6/7/8 that you can download for free from their website.

So I downloaded Windows XP SP2 with IE6 and Windows XP SP2 with IE8 images. Then I loaded them up, loads quicker than installing Win XP myself took. Also now means that I don't have to use the illegal version of Win XP I was using previously to test stuff on IE6.

To get internet and be able to connect to my localhost in the virtual PC I had to go on the settings for the virtual machine and change the networking adapter to 'Shared networking (NAT)'. Then to access localhost from the virtual machine I just had to type in the i.p. address of my actual PC.

After getting this working I deleted the old win XP virtual machine I had made, VMWare and a few other old programs I found in the add/remove programs section of control panel.

Food
Breakfast: Frosties; cup o' tea.
Morning snack: Crinkle crunch cream; milk chocolate digestive; cup o' tea.
Lunch: ½ Peppered ham sandwich; cheese on toast; satsuma; kitkat; cup o' tea.
Dinner: Chicken; parsnips; broccoli; potatoes; gravy. Pudding was apple pies with cream. Coffee. Chocolate truffle mix; easter egg.