1

I am looking for the best way of vertical-aligning in CSS. I experience that this is a not-well-solved issue: vertical-align property is not the same as in HTML. I need a code working like the margin:auto property in horizontal way. The code I am using right now is not working everywhere (ex: fadeIn the object). Here it is:

<div style="width:200px; height:100px; background:white; display:table">
    <div style="display:table-cell; vertical-align:middle">
        <img src="image.jpg" height="20" width="100" />
    </div>
</div>
Dimitri Dewaele
  • 10,311
  • 21
  • 80
  • 127
marcias
  • 236
  • 4
  • 13

2 Answers2

1

Take a look at this tutorial on Vertical Centering in CSS. Related questions Vertical aligning in CSS?, What's The Best Way of Centering a Div Vertically with CSS? and Vertially aligning a DIV on the entire page also contain some helpful answers.

Community
  • 1
  • 1
EdoDodo
  • 8,220
  • 3
  • 24
  • 30
1

Try the absolute position method used here. It would be nice if you actually posted a jsfiddle with animations and whatnot so we can see.

meder omuraliev
  • 183,342
  • 71
  • 393
  • 434
  • Thanks, this link is very useful. I use the code in section "Dynamic Height Block-Level Element Inside Dynamic Height Container". But: what if my object has to have a display:none property, because this fades in? – marcias Nov 25 '10 at 16:01
  • OK, I think there is no better way around the Internet, I accept this answer. Thanks! – marcias Nov 25 '10 at 16:05