Try it Live

​x
 
<!DOCTYPE html>
<html>
 <head>
  <style>
  .flexbox-container {
    margin:10px;
    background-color: aqua; 
    display: flex;
    width:300px;
    height:150px;    
  }
  
  .child-items {
    padding: 25px 0;
    margin: 5px;
    width:80px;
    text-align: center;
    border:1px solid olive;
    background-color: gold;
  }
  </style>
 </head>
 <body> 
   <h2>self-align:center</h2>
  <p>Item 2 has slef aligned itself to center</p>
  <div class="flexbox-container">
    <div class="child-items">Item 1</div>
    <div class="child-items" style="align-self: center">Item 2</div> 
    <div class="child-items">Item 3</div> 
  </div>
 </body>
</html>
​