I've just done this for a project, and achieved it by using the h6 tag which I wasn't using for anything else:
in html code:
<h6><img alt="small drawing" src="../Images/image1.jpg" width="50%"/> <img alt="small drawing" src="../Images/image2.jpg" width="50%"/><br/>Optional caption text</h6>
The space between the image tags puts a vertical gap between the images. The width argument in each img tag is optional, but it neatly sizes the images to fill the width of the page. Notice that each image must be set to take up only 50% of the width. (Or 33% if you're using 3 images.) The width argument must come after the alt and src arguments or it won't work.
in css code:
/* h6: set presentation of images */
h6
{
font-family: "Franklin Gothic Demi", serif;
font-size: 1.0em;
font-weight: normal;
line-height: 1.25em;
text-align: center;
}
The text items set the look of the caption text, and the text-align property centers both the images and the caption text.