View Full Version : Vertically align image within li

May 7th, 2007, 04:27 PM
How can I vertically align an image within an element (a list item, in this case)? Iíve seen several explanations describing the many possible ways of doing this, and Iím wondering which is the simplest way, in your opinion, to accomplish this? There seems to be so much complexity to what might be considered a fairly straightforward operation, so Iím hoping you could suggest the simplest way of doing this (i.e. what do you do?).

The height of the li is known at development time, but the height of the image varies per image.

I tried setting the images to be absolutely positioned so that I could position them relative to the containing li, but that removed all images from the normal flow which is different from what Iíd like to do.

I also tried experimenting with setting the containing li and image to be an inline and block element so that vertical-align might work, but that didnít seem to work.

Any advice as to how I can make this work? Thanks.

May 8th, 2007, 08:31 PM
Do you have some example code showing what you have tried? Possibly a link.