4 months of trying to get the popup in the right place

[threeyzmonkeys]

:confused: <!-- Source: Dynamic Drive CSS Library -->

I posted a few months ago and was told how to make a new class to get my images going to the left as well as right. I also need to have some of them appearing above the thumbnail and I cannot work out how to do it. I tried making a new class but can't get it right. I also can't work out which part of the code is telling the image where to appear.

Also, is there any way of changing the pop up images text color, or giving it a background?

Here's my text.
Any help or advice would be gratefully appreciated.

<!-- URL: http://www.dynamicdrive.com/style/ -->
<style type="text/css">
.thumbnail{
position: relative;
z-index: 0;
}
.thumbnail:hover{
background-color: transparent;
z-index: 50;
}
.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: transparent;
padding: 0px;
left: 200-px;
border: 0;
visibility: hidden;
color: white;
text-decoration: none;
}
.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}
.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */
}
}
.thumbnail:hover span.lefty{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: -60px; /*position where enlarged image should offset horizontally */

</style>
<a class="thumbnail" href="#thumb1"><img src="img1.jpg" width="20px"height="20px"border="0"/><span><img src="img1.jpg"/><br/>text</span></a><a class="thumbnail" href="#thumb2"><img src="img2.jpg"width="20px"height="20px"border="0"/><span class="lefty"><img src="img2.jpg"/><br/>text</span></a>
<br />
<br />

[jr_yeo]

if it is not too much trouble, could u pls post the corresponding DD CSS Library url that u are having trouble with and kindly post a link to ur very own problematic page? :D

[threeyzmonkeys]

This is the URL I'm having trouble with: http://www.dynamicdrive.com/style/cs...p-image-viewer

and this is the page: http://www.notjustalogo.com

hopefully, when I've finished the images at the bottom will go above the thumbnail and those at the top downwards.