Mam sobie Diva powiedzmy 100x100px, w którym mam drugiego diva ze zdjęciem 100x100px.

O ile zdjęcie jest 100x100 nie ma żadnego problemu, (obrazek 1)
Jeśli zdjęcie jest np 30x100px, wtedy wędruje na górę diva a tak jest źle. (obrazek 2)
Muszę umieścić diva z małym zdjęciem na środku drugiego diva zawsze (obrazek 3)

Nie było by żadnego problemu, tylko że jest to sklep internetowy i muszę użyć tego samego stylu css do wszystkich przypadków bo fotka wpada z automatu.

Macie jakieś pomysły? Z góry dzięki.

[HTML] pobierz, plaintext 
<div style="line-height:300px; border:1px solid red; width:300px; height:300px;text-align:center;">
<div style="background-color:#eee;display:inline;vertical-align:middle">TEST</div>
</div>
[HTML] pobierz, plaintext 

Witam. Zastosowałem powyższy kod, niestety nie działa w dalszym ciągu..


Tak to wygląda u mnie:

[HTML] pobierz, plaintext 
<div style="height: 135px; line-height: 135px; text-align: center;">
<div style="display: inline; vertical-align: middle;">{ZDJECIE}</div>
</div>
[HTML] pobierz, plaintext 

tak mysle że może by zastosować margin ?

Nie wiem po co ten drugi DIV... Dodatkowo zdjęcie (znacznik IMG) musi posiadać w stylach "vertical-align: middle".

[HTML] pobierz, plaintext 
<div style="height: 135px; line-height: 135px; text-align: center">{ZDJECIE}</div>
[HTML] pobierz, plaintext 

Już wyjaśniam. Do {ZDJECIE} nie mam dostępu, sklep nadaje tam kod i wrzuca coś takiego jak poniżej.

[HTML] pobierz, plaintext 
<div style="height: 135px; line-height: 135px; text-align: center;">
<span class="galleria_tryb4"><a href="..."><img alt="..." title="..." src="..." border="0"></a></span>
</div>
[HTML] pobierz, plaintext 

Wrzuciłem więc dla IMG przez spana te funkcje i .... lipa >>>>macie jakieś pomysły?
.galleria_tryb4 img {
vertical-align: middle;
display: inline;
}