16. flex layout 1

  - accepted / - tried

Suppose we have to layout a bunch of items with below requirements.

  1. fill out to width:100px, but stretch to fill the available space and shrink if not enough
  2. stack them if needed

HTML structure is

<div class="container">
  <div class="item"></div>
  <div class="item"></div>
  <div class="item"></div>
</div>

1.width:60px

2.width:150px

3.width:250px

4.width:400px