Re-order Items Using CSS

Problem

You have items that need to be in a specific order in certain scenarios (e.g. an image should be above text on mobile, but not on desktop)

 

Solution

.wrapper {
display:flex;
flex-flow: column;
}

#item1 {
order:4;
}

#item2 {
order:3;
}

#item3 {
order:2;
}

Leave a Reply

Your email address will not be published. Required fields are marked *