JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<div class="wrapper">
    <div class="yellow">
    </div>
    <div class="red">
    </div>
</div>

CSS

.wrapper {
  display: flex;
  flex-flow: row wrap;
}

.yellow {
	background: yellow;
	width: 20%;
	height: 300px;
}

.red {
	background: red;
	width: 20%;
	height: 300px;
}

@media screen and (max-width:600px) {
	.yellow {
	    order: 2;
		width: 100%;
	}

	.red {
	    order: 1;
		width: 100%;
	}
}