You can make b
element full width with flex: 0 0 100%
and change order to order: 2
with media queries DEMO
* {
box-sizing: border-box;
}
body, html {
margin: 0;
padding: 0;
}
.content {
display: flex;
flex-wrap: wrap;
}
.b {
background: lightblue;
}
.a, .b, .c {
border: 1px solid black;
flex: 1;
padding: 10px;
}
@media(max-width: 768px) {
.b {
flex: 0 0 100%;
order: 2;
}
}