How to center div that contains an image within a div?

Question

I need to center a image inside a div both vertically and horizontally. I am using the display inline-block property.

HTML

Answer 1

You can put the image into a table like this:

And then use this in your CSS:

.image-container {
   vertical-align: middle;
   text-align: center;
}

JSFiddle