[CSS] Uniwersalny sposób na"vertical-align" obrazka w DIV'ie


(DJ J) #1

Witam serdecznie,

poszukuję skutecznego sposobu na pionowe wyśrodkowanie obrazka umieszczonego w div'ie (bez użycia tabel, współgrającego z IE6-8, Firefox, Opera ... ).

DIV o ustalonych wymiarach (np. kwadrat 100px-100px), a w nim generowany obrazek o max-height: 90px; max-width: 90px.

Do tej pory wszystkie próby, które sprawdzają się w Firefoxie kompletnie rozsypują się w IE. Proszę o poradę.

Pozdrawiam,

DJ J


(GediMaster) #2

(ra-v) #3

Na to...

vertical-align: middle;

display: table-cell;

...IE7 też gwiżdże, dopiero od IE8 działa. W Operze i innych to powinno już działać.

Masz 4 wyjścia:

  1. Te co wyżej (pracochłonne)

  2. Olać IE7 (niewskazane, w końcu to może być 1/4 użytkowników)

  3. Zrobić tabelkę (trochę trudniejsze od pkt 2)

  4. Zrobić warunek że dla IE6-7 ma zastosować pkt 3 a dla reszty nie (mniej pracochłonne niż pkt 1).

Uffff... zapunktowałem :smiley:

_____ EDIT _________ drobna korekta ________


(Remek Dobrowolski) #4

Zajrzyj tu:

http://www.brunildo.org/test/img_center.html

Pozdrawiam.


(Maciej) #5

Zapraszam na mojego bloga

Centrowanie w pionie

Pozdrawiam