3 DIV boxes aligned in a single row

<div>
  <div style="width:60px; height:22px; float:left;">
    BOX 1
  </div>

  <div style="width:100px; height:22px; float:left;">
    BOX 2
  </div>

  <div style="width:60px; height:22px; float:left;">
    BOX 3
  </div>
</div>
<div style="clear:both;"></div>

Center align the group of boxes

<div class="MyButtonsContainer">
  <div class="MyButton">
    BOX 1
  </div>

  <div class="MyButton">
    BOX 2
  </div>

  <div class="MyButton">
    BOX 3
  </div>
</div>
<div style="clear:both;"></div>


.MyButtonsContainer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.MyButton {
  display:inline-block;
  width:60px;
  height:22px;
  float:left;
}