Image Gallery CSS

[Soap]

Hi
I am a newbie to this all and am trying to incorporate the Image Gallery as its provided (great thanks!:)) on this site.
I am wondering how i can change the thumbnails into clickable ones so that the user can not only 'hover' to see the larger image but also click on it....
I hope I can put some sort of code in my stylesheet....instead of writing it in HTML for each thumbnail...
Am also trying to reposition the hover--images as most of my images are so large they dissappear off the screen (ok, ok, so I need to make them smaller but I want to keep them as large as possible)
this is my work-in-progress:http://www.thesoapbox.co.uk/mensen.html

Thank you!!

[Nile]

There would be no point on having you click to see the image with the CSS gallery because, before you can click it, it would appear.

Also, I just took a preview at the source of that site, the link for Home is not valid:


<a href=""/index.html">Home</a>


Lastly, to change the image size of the hover, find this in your CSS:


.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

Just add a width and height. :)

Hope this Helps,
Nile

[Soap]

Thank you very much! I am playing around with and getting the hang of it.
I thought perhaps being able to not only hover but also click would be something my visitors would like....
am now playing around with positioning the larger image.
I've got this now:
.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 0;
left: 200px; top:20px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

[Nile]

Do you need help with this? Or are you just giving your answer(which is a good thing).

[Soap]

No I am getting there now. No help needed so far.....thanks!!