Flexbox

<div class="container">
  <div id="one">1<br>(Order: 2)</div>
  <div id="two">2<br>(Order: 1)</div>
  <div>3<br>(Order: 0)</div>
  <div>4<br>(Order: 0)</div>
</div>

.container {
  display: flex;
  flex-wrap: wrap;
}
.container > div {
  background-color: orange;
  padding: 30px;
  margin: 5px;
  text-align: center;
}
#one {
  order: 2;
}
#two {
  order: 1;
}

<div class="container">
  <div>1<br>(Order: 0)</div>
  <div>2<br>(Order: 0)</div>
  <div id="three">3<br>(Order: -1)</div>
  <div>4<br>(Order: 0)</div>
</div>

.container {
  display: flex;
  flex-wrap: wrap;
}
.container > div {
  background-color: orange;
  padding: 30px;
  margin: 5px;
  text-align: center;
}
#three {
  order: -1;
}