Centering verticaly an image with position:absolute; top:0; bottom:0;margin:auto

[Jozsef K.]

Does anyone know how can I make this work in ie7 without setting a height on the image?

[chrisburton]

Why did you give it an absolute position? It should be margin: 0 auto;

[joshuanhibbert]

There are two main options for vertically centering an element of unknown height with CSS, neither of which work in IE7 (using a pseudo-element, or using display: table. See here for more information: https://css-tricks.com/centering-in-the-unknown/). Your best bet would be to use JavaScript. Here is a jQuery solution, although someone that can do it in JavaScript should be able to come up with something better: http://jsfiddle.net/joshnh/zGw9s/

[Jozsef K.]

@ChristopherBurton
margin: 0 auto; is for horizontal centering, I’m interested in both vertical and horizontal centering.The above mentioned method works with the major browsers, but fails in ie7.Of course it works only with widthless, hightless images and probably tables to(their heights are calculated), but not with widthless-hightless p, div tags.

@joshuanhibbert
Thank you, so I need to set an alternative method for ie7.

[joshuanhibbert]

The jQuery solution I posted should work fine in IE7.

[Jozsef K.]

Thx, but I’m trying to do it only with css.

[Author]

Posts