You can use compatibility view to get a rough idea of what IE7 will look like but it’s not 100% accurate and misses some bugs in IE7 which would be the main reason for using it. The same applies with the Developer tools options.
None of the options recognise this IE7 bug.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>IE7 general sibling selector (~) bug 1</title>
<style type="text/css">
/* The ruleset below (empty or otherwise) is required for the bug! */
.holder b {
}
.holder ~ span b {
background: red;
}
</style>
</head>
<body>
<div class="holder">
<i>
<!-- HTML COMMENT OR ANY ELEMENT -->
<span>
<span><b>My background shouldn’t be red!</b></span>
</span>
</i>
</div>
</body>
</html>
Therefore I could never trust it as I test in different browers to find bugs not ignore them It’s ok for a rough idea and useful for a quick check but don;t rely on it. (Unlike IEtester which Ryan mentioned above and spots the bug correctly.)
Note that the quirks mode option in IE8 makes IE render in quirks mode which will be similar to IE5 but again not accurate enough for any real testing. There is no option to emulate ie6.
All in all it’s more a fiasco than a help. It introduces three or four more rendering inconsistencies to deal with.
You’re all right! #navbar li {display:inline} did the trick. It is updated now. I’m really sorry I supplied the wrong CSS. I’d been changing things and waiting for 30 minutes for BrowserShots, changing things and waiting for 30 minutes for BrowserShots, changing things and waiting for 30 minutes for BrowserShots, etc. And I must have got confused!
Yes to test everything exactly would be a nightmare and in reality we can’t really do that viably. I do have XP, vista and windows 7 on different machines with varying versions but its such a pain to switch between computers that I just use IEtester (although it does crash a bit)
I tried to install the IE collection from here some time ago but it crashed really badly and I had to reboot the whole system losing work in the process. Of course that may be it just doesn’t like my set up but I believe it does much the same job as IE tester anyway. At least the IEtester only crashes itself :).
It’s a shame there isn’t a really stable version around of either one.
Previously I used the tredosoft version but it’s not maintained anymore (and was buggy anyway)
ie collection gives you the opportunity to test ie v1 to v8. meaning you can install any combination or none of those versions. there are actually check boxes for each version nothing unfortunate here. side note - ie collection gives you ie1.5, ie2.01, ie3.0, ie3.01…, ie8.
ie collection also requires one download. it’s a single exe file with an install wizard.
almost no diff… moot point.
most people use windows… very moot point.
i’m the exception not using windows… extremely moot point.
Unfortunately you only need IE6/7/8. Thus IE collection really only benefits you by giving you IE6/7/8. Same as IEtester. Side note-IEtester gives IE5.5
IEtester only requires a download. As for VMs, they take a lot more work to get done, and it being real IE makes almost no difference at all, when comparing it to IEtester (an emulator)
In all my time using it, I’ve never seen a bug come up on real IE and not on the emulator. Not once.
And yes, for most people (aka window users) IEtester should be used
However if your the exception and you don’t use windows, then yes use the VM
yes you do. ie collection, again, gives you the opportunity to test ie v1 to v8. real genuine ie. which is always better then an emulator.
and vms for non-windows os you do know some test for ie in a non-windows envir, don’t you? your IEtester only works on windows os. so you need vms for others. IEtester or not
which ever (i mean having a doctype or not, or having a doctype and using the developer tool to switch to quirks mode). by using developer tool you can choose to see how ie7 handles quirks mode or how ie8 handles it.
As Ray said the #navbar li {display:inline} is missing in your live site and it is this that fixes the staircase effect (although there are other methods).
What happens is that IE7 and 6 don’t collapse the list height to zero but leave it at the current font-size/line-height and therefore each subsequent list is moved downwards but the float still snags on the floated anchors edge.
If you set the list to display:inline then it stops this effect and you can more or less forget about the list. You could instead float the list also or as mentioned above set the line-height/font-size to zero so that there is no height to the list but the easiest solution is display:inline and is the one you already had written down in post #1
Thanks for this discussion guys. I’d used IETester before but had given up with it because it was crashy and I’d heard somewhere that it wasn’t that accurate. But I’ll definitely give it another go. I’ll try IE Collection too. Thanks!
if you want to go that way, the only viable way to test how it would really look in ie6 or ie7 is to actually have ie6 and ie7 at hand, using multiple ie installations if windows os, or vms for ie6 & ie7 if windows or any other os that’s supporting vms
