<div class="parent">
  <h1 class="child-title">Meet the children</h1>
  <p class="child-one">I'm child number 1</p>
  <p class="child-two">I'm child number 2</p>
  <p class="child-three">I'm child number 3</p>
  <img src="https://upload.wikimedia.org/wikipedia/commons/4/45/Funny_Kitten.jpg" alt="cute, furry, children" class="children-img">  
.parent {
  display: flex;
  flex-direction: column;

.children-img {
  order: -1;
  width: 400px;
  height: auto;

/* These are not needed unless you REALLY want to assign an order to EVERY flex item

.child-title {
  order: 2;

  order: 3;

.child-two {
  order: 4;

.child-three {
  order: 5;
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.