CSS Flexbox
HTML
<div class="wrapper">
<div class="image">img</div>
<div class="title">title</div>
<div class="content">content</div>
</div>
SCSS
.wrapper {
display: flex;
flex-wrap: wrap;
width: 100%;
justify-content: flex-end;
}
.title {
background: tomato;
width: 50%;
@media only screen and (min-width: 800px) {
width: 100%;
order: 1;
}
}
.image {
background: cornflowerblue;
width: 50%;
height: 150px;
@media only screen and (min-width: 800px) {
order: 2;
}
}
.content {
background: gold;
width: 50%;
@media only screen and (min-width: 800px) {
order: 3;
}
}