Wyśrodkowywanie zdjęcia (w divie) w pionie. Opcje

[FireMan]

Witam.
Mam problem z wyśrodkowaniem zdjęcia wewnątrz diva w pionie.
Skrypt centruje zdjęcie po środku za pośrednictwem <center> ale nie mogę uporać się z wyśrodkowaniem w pionie.

Jest coś takiego:
<div>
<a><img/></a>
</div>

CSS:

[CSS] pobierz, plaintext 
#av-photo1 {
width: 304px;
max-width: 304px;
height: 304px;
max-height:304px;
float:right;
border:solid 1px grey;
margin-bottom:10px;
}
[CSS] pobierz, plaintext 

HTML:

[HTML] pobierz, plaintext 
<div id='av-photo1'>
<center>
<a border='0' href='$photo2' style='text-decoration: none; border: solid 0px grey;' rel='lightbox'>
<img src='$photo2' style='padding-top:$ile; max-width:304px; max-height:304px; border: 0px;' border='0'/>
</a>
</center>
</div>
[HTML] pobierz, plaintext 

zmiennymi $ile i $photo2 proszę się nie przejmować.

Ten post edytował FireMan 21.08.2011, 22:17:15

[Sephirus]

Ktoś powie, że się czepiam ale jeżeli już używasz zamykania IMG poprzez <IMG /> to nie używaj tagu <CENTER> z tego co wiem to w XHTML go już nie ma (IMG:style_emoticons/default/wink.gif) proponuje <div style="text-align:center"></div> (IMG:style_emoticons/default/wink.gif)

A co do problemu można ustawić aby ten element, w którym znajduje się obrazek zachowywał się jako komórka tabeli - czyli style="display: table-cell" można wtedy zastosować w niej też style="vertica-align:middle" (IMG:style_emoticons/default/wink.gif)

HTH! (IMG:style_emoticons/default/wink.gif)

Ten post edytował Sephirus 22.08.2011, 18:13:06

[konole]

Ktoś powie, że się czepiam ale jeżeli już używasz zamykania IMG poprzez <IMG /> to nie używaj tagu <CENTER> z tego co wiem to w XHTML go już nie ma (IMG:style_emoticons/default/wink.gif) proponuje <div style="text-align:center"></div> (IMG:style_emoticons/default/wink.gif)

A co do problemu można ustawić aby ten element, w którym znajduje się obrazek zachowywał się jako komórka tabeli - czyli style="display: table-cell" można wtedy zastosować w niej też style="vertica-align:middle" (IMG:style_emoticons/default/wink.gif)

HTH! (IMG:style_emoticons/default/wink.gif)

Do wyśrodkowania obrazka w CSS powinno się użyć:

Kod

#obrazek {
  display: block;
  margin: 0 auto;
}