Переставьте div с помощью css

Question

исходное изображение

Сначала посмотрите на картинку, английский не мой родной язык, поэтому трудно объяснить без наглядности. Мои извинения.

Я хочу, чтобы ярлык div (col-md-6) снизу переместился наверх. Я использую бутстрап.

Редактировать: вот фрагмент кода:

<div class="row inview dragula clearfix">

   <div class="col-md-12 clearfix">
      <div class="box clearfix"  style = "height:243px;border:4px dashed rgba(25,25,25,.5)">            
         <div class="box-body draggable handle">
            Set Up
         </div>
      </div>
   </div>

   <div class="col-md-3 clearfix">
      <div class="box " style = "height:243px;border:4px dashed rgba(25,25,25,.5)">
         <div class="box-body  draggable handle">
            Shortcut
         </div>
      </div>
   </div>

   <div class="col-md-3 clearfix">
      <div class="box"  style = "height:243px;border:4px dashed rgba(25,25,25,.5)">
        <div class="box-body draggable handle">
          Shortcut 2
        </div>
      </div>
   </div>

   <div class="col-md-9 ">
      <div class="box"  style = "height:500px;border:4px dashed rgba(25,25,25,.5)">
         <div class="box-body draggable handle">
             Calendar
         </div>
      </div>
   </div>

   <div class="col-md-6 clearfix">
      <div class="box "  style = "height:243px;border:4px dashed rgba(25,25,25,.5)">
         <div class="box-body draggable handle">
             Report
         </div>
      </div>
   </div>

 </div>

Answer 1

Смотрите это

.box {
  margin-bottom: 20px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<div class="row inview dragula clearfix">
    <div class="col-md-3">
        <div class="box clearfix" style="height:243px;border:4px dashed rgba(25,25,25,.5)">

            <div class="box-body draggable handle">
                Set Up
            </div>
        </div>
        <div class="box " style="height:243px;border:4px dashed rgba(25,25,25,.5)">
            <div class="box-body  draggable handle">
                Shortcut
            </div>
        </div>
        <div class="box " style="height:243px;border:4px dashed rgba(25,25,25,.5)">
            <div class="box-body draggable handle">
                Shortcut 2
            </div>
        </div>
    </div>
    <div class="col-md-9 ">
        <div class="box" style="height:500px;border:4px dashed rgba(25,25,25,.5)">
            <div class="box-body draggable handle">
                Calendar
            </div>
        </div>
        <div class="box " style="height:243px;border:4px dashed rgba(25,25,25,.5)">
            <div class="box-body draggable handle">
                Report
            </div>
        </div>
    </div>

</div>