Aligning a float:left div to center?

We are living in 2015 now and CSS Flexbox is well supported. Go here for a good tutorial on flexbox.

This works fine in all newer browsers:

#container {
  display:                 flex;
  display:                 -webkit-flex; /* Safari */
  flex-wrap:               wrap;
  -webkit-flex-wrap:       wrap;         /* Safari */
  justify-content:         center;
  -webkit-justify-content: center;       /* Safari */
}

.block {
  width:              150px;
  height:             150px;
  background-color:   #cccccc;
  margin:             10px;        
}

<div id="container">
  <div class="block">1</div>    
  <div class="block">2</div>    
  <div class="block">3</div>    
  <div class="block">4</div>    
  <div class="block">5</div>        
</div>