Horizontally align divs

HTML

<div id="start" class="side left">
    <span>left</span>
</div>
<div id="end" class="side right">
  
    <span>right</span>
</div>

CSS

body{
  display: flex; 
  flex-direction: column-reverse;
  display: -webkit-flex; 
  -webkit-flex-direction:column-reverse;
  }
.side {
  height: 100px;
   
    width: 400px;
    float: left;
}

.left{ background-color: red;}
.right{ background-color: blue;}


span {
    text-align: center;
    display: block;
    margin: 3px auto;
}