align images horizontally from middle css

Question

I read many article about vertical alignment but how can I align 3 images horizontally from middle?

 <div class="notification-from-picture">    <img src="images/1.jpg" class="img-circle" /> </div>
 <div class="notification-between-from-to"> <img src="images/2.jpg"/>                     <div>
 <div class="notification-to-picture">      <img src="images/3.jpg" class="img-circle"/>< /div>

Answer 1

.notification-from-picture,
.notification-between-from-to,
.notification-to-picture {
     display: inline-block;
 }

and then put a wrapper div around the divs like so

<div id="image-wrapper">
    <div class="notification-from-picture">    <img src="images/1.jpg" class="img-circle" /> </div>
     <div class="notification-between-from-to"> <img src="images/2.jpg"/>                     <div>
     <div class="notification-to-picture">      <img src="images/3.jpg" class="img-circle"/>< /div>
</div>

and then do

#image-wrapper {
    text-align: center;
}

Answer 2

just do this it will work:

 .notification-from-picture,
 .notification-between-from-to,
 .notification-to-picture 
  {  
   display: inline;
  }