Jag håller på och försöker gå över från tabeller till CSS när det gäller thumbnail-sidor. Det jag vill ha är att varje thumbnail ska vara inkapslad och centrerad vertikalt och horisontellt i en ruta som alltid är 150 pixlar i kvadrat.
Jag har lyckats lösa det i Mozilla 1.2a genom att sätta display på "rutan" (div.thumb) och den inkapslade a-taggen så att vertical-align funkar som det gör i tabellceller.
Men Internet Explorer 6.0 vill inte centrera bilden vertikalt :(
.thumb { width: 150px; height: 150px; border: 3px double #779FDD; margin: 3px 3px 18px 3px;
background-color:#87A6CB; float: left; display: table;}
.thumb a { width: 100%; height: 100%; text-align: center; display: table-cell; vertical-align: middle}
PS: Ni kanske undrar varför jag har en border som färgmässigt ligger väldigt nära bakgrundsfärgen, men det är för att jag har en hi-light effekt på hover då bordern blir röd.