如何在单个DIV中居中2个图像

Question

I have a DIV tag that contains 2 tags. I want these figures to center themselves within the DIV, which is supposed to be centering itself within the middle of the page. How do I do this?

HTML:

<div class="images-captions">
    <figure><img src="images/Prop Pics/From Mike B aka StratosDadRI/intial-blueprinting_thumb.jpg" alt="Intial Blueprinting"><figcaption>After intinal blueprint</figcaption></figure>
    <figure><img src="images/Prop Pics/From Mike B aka StratosDadRI/after-damage_thumb.jpg" alt="After Damage"><figcaption>After damage</figcaption></figure>
</div>

CSS:

.images-captions            { width: 600px; margin: 0 auto; }
.images-captions figure     { float: left; width: 250px; padding: 10px;}
.images-captions figcaption { text-align: center; font-style: italic;   }

Answer 1

Center them horizontally

This case I would solve like this:

CSS

.images-captions {
    width: 600px;
    margin: 0 auto;
    text-align: center;
}

.images-captions figure {
    display: inline-block;
    width: 200px;
    margin: 0;
    padding: 10px;
}

.images-captions figcaption {
    font-style: italic;
}

Demo

Try before buy

Center them vertically

You can solve it like this:

CSS

.images-captions {
    width: 600px;
    margin: 0 auto;
    text-align: center;
}

.images-captions figure {
    width: 200px;
    margin: 0 auto;
}

.images-captions figcaption {
    font-style: italic;
}

Demo

Try before buy

Answer 2

You can solve it by adding the text-align to the figure

.images-captions figure     { float: left; width: 250px; padding: 10px;text-align:center}
.images-captions figcaption { font-style: italic;   }

For understanding:
You want to align the text in the parent conatainer. So you have to add the attribute to the parent element and not the element itself

DEMO on fiddle