How to horizontally center a div in a div?

HTML :)

<div class="outer">
    <div class="innerdivs">
        Left Div
    </div>
    <div class="innerdivs">
        Right Div
    </div>
    <div class="innerdivs">
        Center Div
    </div>
</div>

CSS :)

html{
  background: #FFF;
  color: #FFF
}

.outer {
  background: gray;
  display: block;
  height: 144px;
  margin: auto;
 
  position: absolute;
  left:0;
  right: 0;
  top: 0;
  bottom: 0;
 
  width: 50%;
 
  -webkit-column-count: 3;
  column-count: 3;
}

.innerdivs {
  border: 1px solid red;
  height: 142px;
  text-align: justify;
  width: 100%;
}

Output :)