[Vuejs]-Checkbox button is not located inline with the other buttons

.modal-header {
  padding: 15px;
  border-bottom: 1px solid #e5e5e5;
}

.btn {
  display: inline-block;
  float: right;
}

<div class="modal-header">
  <button class="btn">close</button>
  <button class="btn">refresh</button>
  <dropdown style="float:left;">
    <button class="btn">export</button>
  </dropdown>
</div>

<div class="modal-header">
  <button class="btn">close</button>
  <button class="btn">refresh</button>
  <dropdown style="float:right;">
    <button class="btn">export</button>
  </dropdown>
</div>