| <!DOCTYPE html> |
| <style> |
| .flex { |
| display: flex; |
| flex-flow: column wrap; |
| max-height: 200px; |
| background: blue; |
| color: blue; |
| } |
| |
| .item { |
| flex: 0 0 auto; |
| line-height: 20px; |
| } |
| </style> |
| There should only be a blue box below, and the word "FAIL" should |
| not be seen. |
| <div class="flex"> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| <span class="item">FAIL</span> |
| </div> |
