Problems with Image Thumbnail Viewer Script in IE

[Privileged]

Image Thumbnail Viewer Script

http://www.dynamicdrive.com/dynamicindex4/thumbnail.htm


I am having prolbems with how the images on my website are presented IE They show up fine in Firefox, Chrome and Safari but they extend beyond the content page in IE, overlap with other text causing the page to shift.


<br>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/the-lyndhust.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/the-lyndurst-thumb.jpg" alt="old colonial houses, new old houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/hopefield.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/hopefield-thumb.jpg" alt="Jamaican scene, photos of old stone houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/colonialhouse.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/colonialhouse-thumb.jpg" alt="tropical pictures, st. ann jamaica, old plantation house"></a></div>
</div>

<p></p>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/porus-house.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/porus-house-thumbnail2.jpg" alt="tropical sunrise, jamaica morning, caribbean sea pics"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/rennies.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/rennies-thumb.jpg" alt="pictures of old houses, renovating old houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/leftovers.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/leftovers-thumb.jpg" alt="old smoke houses, tropical cottage, this old house"></a></div>
br>
<br>
<br>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/comforthall.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/comforthall-thumb.jpg" alt="old colonial houses, old stone houses, old farm houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/bluehouse.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/bluehouse-thumb.jpg" alt="old colonial houses, old cottages,tropical cottages"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/peak-roofs.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/peak-roofs-thumbnail2.jpg" alt="tropical pictures, picturesque old cottage, renovate old houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/sav1.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/sav1-thumb.jpg" alt="old houses by the ocean, old country houses, wrap around veranda"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/sav2.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/sav2-thumb.jpg" alt="pictures of old houses, renovating old houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/summerhouse.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/summerhouse-thumb.jpg" alt="pictures of old houses, renovating old houses"></a></div>
<br>

<br>
<br>
<br>
<br>
<br>
<p></p>
<p></p>
<p></p>
<br>
<br>


<br>
</p>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/redstep.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/redstep-thumb.jpg" alt="old colonial houses, old red brick houses, pictures of old houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/bland.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/bland-thumb.jpg" alt="old colonial houses, bland house, ugly old houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/redcottage.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/redcottage-thumb.jpg" alt=", picturesque old cottage, photography old houses"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/norwood1.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/norwood1-thumb.jpg" alt="old colonial houses, old red brick houses, st andrew, jamaica"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/pinkhouse.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/pinkhouse-thumb.jpg" alt="old colonial houses, old pink house, tropical cottages"></a></div>
<div id="thumbnail-small"><a href="http://www.pictures-of-jamaica.com/image-files/trainstation.jpg" rel="thumbnail"><img style="border: 2px solid ; width: 160px; height: 120px;" src="http://www.pictures-of-jamaica.com/image-files/trainstation-thumb.jpg" alt="tropical pictures, picturesque old cottage, renovate old houses"></a></div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>

<br>
<br>


<p> Copyright © 2009 pictures-of-jamaica.com All rights reserved.
</p>
</div>

<!-- end Liner --> </div>
<script src="http://www.pictures-of-jamaica.com/support-files/thumbnailviewer.js" type="text/javascript">
/***********************************************
* Image Thumbnail Viewer Script- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
<!-- end Footer --><!-- end PageWrapper --><!-- google analytics -->

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-10840733-1");
pageTracker._trackPageview();
} catch(err) {}</script>
</div></body></html>

Can anyone please help?

Thanks.

[jscheuer1]

This would be much easier to diagnose if we had a link to a live page which demonstrates the problem.

How about it?

[Privileged]

Hi John,

My site is http://www.pictures-of-jamaica.com/tropical-scenery.html

The thumbnails display horribly here and in other pages on the site in IE but fine elsewhere.

Thanks for taking a look.

[jscheuer1]

Near as I can tell, this is just a layout problem. If you set the container division's width to like 585px or so:


<h1>Tropical Scenery</h1>
<!-- below-h1 --><br>
<div style="text-align: justify; width: 585px;">Have you ever visited a
tropical island and been left wondering somewhat whether there isn't
more to the island than sand and sea? Well if you have, you should come
to Jamaica because when it comes to diversity o

It should improve things, does here in IE 7 using its developer toolbar. However, your page could use a complete makeover (it has script, css and validation errors, and cannot take advantage of the space that might be available to it in some browsers. Unfortunately that is not something we generally undertake in these forums.

[Privileged]

Thanks John I worked on it and it now works in IE.

Learned a lot too.