So instead of:

<div id="gallery">
<a href="#"><img src="frozen_lake.jpg" alt="Frozen Lake" title="Frozen Lake" /></a>
<a href="#"><img src="sunrise.jpg" alt="Sunrise" title="Sunrise" /></a>
<a href="#"><img src="fountain.jpg" alt="Fountain" title="Fountain" /></a>
<a href="#"><img src="peacock.jpg" alt="Peacock" title="Peacock" /></a>
<a href="#"><img src="boat.jpg" alt="Boat" title="Boat" /></a>
<a href="#"><img src="sunset.jpg" alt="Sunset" title="Sunset" /></a>
<a href="#"><img src="neon_grill.jpg" alt="Neon Grill" title="Neon Grill" /></a>
<a href="#"><img src="old_print_shop.jpg" alt="Old Print Shop" title="Old Print Shop" /></a>
<br style="clear:both;" />
</div>

You end up with:

<div id="gallery">
<a href="frozen_lake.jpg"><img src="frozen_lake.jpg" alt="Frozen Lake" title="Frozen Lake" /></a>
<a href="sunrise.jpg"><img src="sunrise.jpg" alt="Sunrise" title="Sunrise" /></a>
<a href="fountain.jpg"><img src="fountain.jpg" alt="Fountain" title="Fountain" /></a>
<a href="peacock.jpg"><img src="peacock.jpg" alt="Peacock" title="Peacock" /></a>
<a href="boat.jpg"><img src="boat.jpg" alt="Boat" title="Boat" /></a>
<a href="sunset.jpg"><img src="sunset.jpg" alt="Sunset" title="Sunset" /></a>
<a href="neon_grill.jpg"><img src="neon_grill.jpg" alt="Neon Grill" title="Neon Grill" /></a>
<a href="old_print_shop.jpg"><img src="old_print_shop.jpg" alt="Old Print Shop" title="Old Print Shop" /></a>
<br style="clear:both;" />
</div>

If you’d like, you may also add a conditional statement that will only be seen by people who use IE6 or older versions of IE, such as:

<!--[if lte IE 6]>
<p id="old_ie">You won't see this photo gallery as intended, because you are using an obsolete version of Internet Explorer. Due to its many bugs and security holes, you should <a href="http://www.google.com/#hl=en&q=upgrade+ie&btnG=Google+Search&aq=f&oq=upgrade+ie&fp=1_wXsDL0V4s">upgrade your IE</a>, or switch to a different browser all together. Better browsers than the one you are currently using include, but are not limited to: <a href="http://www.mozilla.com/firefox/">Firefox</a>, <a href="http://www.opera.com/download/">Opera</a>, <a href="http://www.apple.com/safari/">Safari</a>, <a href="http://www.flock.com">Flock</a>, and <a href="http://www.google.com/chrome">Google Chrome</a>.<br /><br />To see enlarged photos in this browser, click on the thumbnails. Then, click the back button in your browser's toolbar to return to this page.</p>
<![endif]-->

You may then style (and even position) that message by targeting #old_ie in your CSS, without it affecting any other browsers.

It has been brought to my attention by a friend who has access to IE6, that the images don’t enlarge in IE6 when they’re hovered on. Since IE6 is incompatible with Windows Vista (go figure), I downloaded IETester and did some experimenting with it.

Here is what I found. If you have standalone versions of IE (works only with Windows XP), or a program like IETester (works with XP or Vista, but it crashes occasionally on my laptop), you may be able to see these results for yourself. Otherwise, you can just read my comments on the experimental pages.

Note: If you view it in the standalone that I linked to above, the last page in my experiments will display incorrectly because the page uses an IE conditional statement that the standalone doesn’t recognize. In IE6, the last page actually looks like the page before it, and IETester depicts this behavior accurately.

Another thing I didn’t add to the comments on those pages is that the layout is messed up in IE6. The thumbnails appear in 3 columns instead of 4, and there is extra space on the right. You can see this for yourself without installing anything if you go to Total Validator, paste in this url, and choose IE6 from the dropbox where it says “Screenshot”. The url and screenshot are all you need to fill in/choose, then submit at the bottom, wait for it to process, and scroll down to see the screenshot.

The results in Safari, Opera, Flock, and Google Chrome (all on Windows) were all the same as the results in Firefox. This goes for the page used in this tutorial as well as the experimental pages, and IE6 is the only browser I tested with that doesn’t display the initial code correctly.