Intanto i codici:

Nell'HTML:
codice:
<div class="shad">
<a href="../img/zeus.jpg" onclick="if(w>800){showpic(href);return(false);}" target="_blank">
<span>[img]../th/zeus.jpg[/img]</span>
<span class="alt">Zeus Tonante</span>
</a>
</div>
Nei CSS:
codice:
#corpo .shad{
        margin: 1em 0 0 1.5em;
        float: right;
        background: url(img/shadalpha.png) no-repeat bottom right !important;
        background: url(img/shad.gif) no-repeat bottom right;
        }

#corpo .shad a{
	position: relative;
	margin: -6px 6px 6px -6px;
	display: block;
	text-decoration: none;
	background-color: transparent;
        }

#corpo .shad a:hover{
	text-decoration: none;
	background-color: transparent;
	}

#corpo .shad span{
	border: 1px solid #A9A9A9;
	background-color: #FFFFFF;
	display: block;
	text-align: center;
	}

#corpo .shad img{
	margin: 3px;
	}

#corpo .shad .alt{
	border-top: none;
	font-size: 10px;
	text-transform: uppercase;
	}
Questi sono i codici che uso per ottenere delle thumbnails con questo risultato:



Ora devo fare delle gallerie di immagini, e devo tenere la stessa impostazione della thumbnail (bordi, spazi, ombre etc).

Il problema è che in una galleria di thumb, la thumb deve avere uno spazio massimo di 210x210 px per estendersi, e in questo spazio deve essere allineata perfettamente al centro: con la proprietà float però non trovo il modo di spostare al centro di qualsiasi cosa (un div o un td) il div "shad". Tuttavia, se tolgo la proprietà float, il rendering della thumb viene completamente a decadere, perché i bordi grigi si adattando al box superiore invece che alla immagine, le ombre non rispettano i posizionamenti etc.

Inutile dire che ogni immagine-thumbnail ha le sue dimensioni, quindi mettere una dimensione fissa per il div "shad" non è pensabile.

So di essere contorto nello spiegarmi, se avere bisogno di ulteriori chiarimenti dite

Help