Edit in JSFiddle

#flexstart {    
    align-items:flex-start;
}
#flexend {     
    align-items:flex-end;
}
#center {      
    align-items:center;
}
#baseline {    
    align-items:baseline;
}
#stretch {
    align-items:stretch;    
}

.flexbox {
    display:flex; 
    flex-direction:row;   
    height:150px;    
}
div {
    border:1px solid #cccccc;
    margin:5px;  
    padding:5px;
}
div > div {
    background:#ffcc99;
}
div > div:nth-child(2){
  height:40px;
}
div > div:nth-child(3){
  height:60px;
  line-height:50px;  
}

flex-start
<div id="flexstart" class="flexbox">
   <div>Item 1</div>
   <div>Item 2</div>   
   <div>Item 3</div>
   <div>Item 4</div>
   <div>Item 5</div>   
</div>
flex-end
<div id="flexend" class="flexbox">
   <div>Item 1</div>
   <div>Item 2</div>   
   <div>Item 3</div>
   <div>Item 4</div>
   <div>Item 5</div>   
</div>
center
<div id="center" class="flexbox">
   <div>Item 1</div>
   <div>Item 2</div>   
   <div>Item 3</div>
   <div>Item 4</div>
   <div>Item 5</div>   
</div>
baseline
<div id="baseline" class="flexbox">
   <div>Item 1</div>
   <div>Item 2</div>   
   <div>Item 3</div>
   <div>Item 4</div>
   <div>Item 5</div>   
</div>
stretch
<div id="stretch" class="flexbox">
   <div>Item 1</div>
   <div>Item 2</div>   
   <div>Item 3</div>
   <div>Item 4</div>
   <div>Item 5</div>   
</div>