Html css order property
<!DOCTYPE html>
<html>
<head>
<title>Reorder my divs</title>
<style>
.example {
display: -webkit-flex;
display: flex;
font-family: sans-serif
}
.example div {
width: 300px;
height: 100px;
line-height: 100px;
text-align: center;
color: #fff;
font-size: 30px
}
div#red {
order: 2;
background-color: red
}
div#green {
order: 3;
background-color: green
}
div#black {
order: 1;
background-color: black
}
div#blue {
order: 4;
background-color: blue
}
</style>
</head>
<body>
<h2>Reorder my divs</h2>
<div class="example">
<div id="red">1</div>
<div id="green">2</div>
<div id="black">3</div>
<div id="blue">4</div>
</div>
</body>
</html>
