Search code examples
htmlcssvertical-alignment

Dynamic DIVs vertical-align middle with CSS

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>
Solution

  • 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.