równe wyświetlanie zdjęć

Witam,

Mam taki kod:
html:

	<div class="thumb">
		<img src="picture-1.jpg"  />
	</div>

i css:

div.thumb { border: 1px solid #000; width: 131px; height: 128px; 
	display: table-cell; vertical-align: middle; text-align: center; }
	
div.thumb img { border:0; height: 100%; }

Problem:
elementów div.thumb jest wiele na stronie, ponieważ jest to galeria zdjęć, chciałbym, aby wszystkie były ładnie ułożone obok siebie, dla takich przypadków:

1. jeśli zdjęcie jest wysokie (height) i wąskie (width)
2. jeśli zdjęcie jest niskie (height) i szerokie (width)

Przy takim kodzie, jw. udaje mi się rozwiązać problem tylko dla jednego punktu, jak rozwiązać go dla obu naraz ?

może ustaw stałą szerokość i wysokość thumb, i max wysokość/szerokość obrazków wewnątrz ?

Dać kazde zdjecie w ramce 1px o nieinwazyjnym kolorze i dopasowywac do srodka (albo beda marginesy polewej i prawej, albo u gory i dołu)

html:

	<div class="thumb">
		<img src="picture-1.jpg"  />
	</div>

i css:

div.thumb { border: 1px solid #000; width: 128px; height: 128px; 
                  text-align: center; }
	
div.thumb img { border:0; height: 128px;width: auto; margin: auto; }

Sprawdź czy takie rozwiązanie Cię zadowala.

nie bardzo, bo rezultat wygląda tak jak w załączniku
a chciałbym, aby oba obrazy były jednakowej wielkości - przy zachowaniu proporcji...

max-height:128px;
max-width:128px;