Aligning img elements horizontally and vertically in the middle of a floating div

Question

I'm looking for a solution to align some images vertically and horizontally in the middle of a div that has fixed size of 96x96.

There is a solution at How to make an image center (vertically & horizontally) inside a bigger div. But it assumes that we know the sizes of the images. But in my case, the sizes are varying.

Also, I just want to use CSS. I don't want to use a jquery plugin like this.

Any help will be appreciated. Thanks.

EDIT: I've found a solution by using images as background and setting the background-position to 'center center'.

Answer 1

Need to center align the image in CSS

Also adding content related images trough css is considered bad practice. Once the user turns off CSS your content is gone.