<style> .wrapper { display: flex; flex-direction: column } @media only screen and (max-width: 767px) { .wrapper1 { order: 2 } .wrapper2 { order: 1 } } </style> <body> <div class="wrapper"> <div class="wrapper1"> <div class="col s12 l6"> some text </div> </div> <div class="wrapper2"> <div class="col s12 l6"> some more text </div> </div> </div> </body>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter