CSS Flexible Box (Flexbox) Layout Demo

In the flex layout model, the children of a flex container can be laid out in any direction, and can 'flex' their sizes, either growing to fill unused space or shrinking to avoid overflowing the parent. Both horizontal and vertical alignment of the children can be easily manipulated. Nesting of these boxes (horizontal inside vertical, or vertical inside horizontal) can be used to build layouts in two dimensions. CSS Flexible Box Layout Module Level 1, W3C Candidate Recommendation, 19 November 2018

<container id=container>
  <div id=item-one>item-one</div>
  <div id=item-two>item-two</div>
  <div id=item-three>item-three</div>
</container>