title: What does 'flex-order' actually mean?
body: <p><a href="https://material.angularjs.org/latest/layout/children" rel="nofollow noreferrer">Angular Material</a> states that :</p>
  <blockquote>
  <p>Add the flex-order directive to a layout child to set its order position within the layout container. Any integer value from -20 to 20 is accepted.</p>
  </blockquote>
  <p>What does <code>flex-order</code> attribute actually do? The statement above confuses me and the example given by them is also not very clear. Is this somewhat related to <code>z-index</code> property we have in CSS?</p>
  <p>An elaborate explanation with a demo would be appreciated !</p>