Как сделать стек div без пробелов и сохранить порядок на меньших размерах - в Bootstrap

Я действительно не знаю, как выразить это словами.

Когда у меня есть 2 деления подряд, каждый имеет разную высоту, поэтому в следующем ряду будет ненужное место.

Но правильно сложите на маленьком экране.

 <div class="row">
    <div class="col-lg-6 col-md-6 col-sm-12"> div 1 </div>
    <div class="col-lg-6 col-md-6 col-sm-12"> div 2 </div>
  </div>
  <div class="row">
    <div class="col-lg-6 col-md-6 col-sm-12"> div 3 </div>
    <div class="col-lg-6 col-md-6 col-sm-12"> div 4 </div>
  </div>

Но когда я убираю строки и помещаю все div слева в 1 div, а справа в 1 div, свободного места нет.

Но они складываются в неправильном порядке на маленьком экране.

  <div class="col-lg-6 col-md-6 col-sm-12">
    <div> div 1 </div>
    <div> div 3 </div>
  </div>
  <div class="col-lg-6 col-md-6 col-sm-12">
    <div> div 2 </div>
    <div> div 4 </div>
  </div>

Обратите внимание, что они не просто 4 деления, а как минимум 8.

Надеюсь, это понятно. Я ценю любую помощь.

Ответы на вопрос(7)

Ваш ответ на вопрос