# 🏅 Day 16 - flex 完成九宮格排版

請嘗試在「`...`」的地方加上 CSS flex 屬性完成以下圖片中的排版


HTML

<div class="container">
  <ul class="list">
    <li><img src="https://images.unsplash.com/photo-1602874268377-82a72d59ef4c?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
    <li><img src="https://images.unsplash.com/photo-1603143422172-2568ea9680ac?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
    <li><img src="https://images.unsplash.com/photo-1603135200184-96051b5ede9a?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
    <li><img src="https://images.unsplash.com/photo-1590532740179-b7472613c3c4?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
    <li><img src="https://images.unsplash.com/photo-1603162361859-49444c0aaebc?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
    <li><img src="https://images.unsplash.com/photo-1603182737247-6419d55c10bd?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
    <li><img src="https://images.unsplash.com/photo-1603135200184-96051b5ede9a?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
    <li><img src="https://images.unsplash.com/photo-1603188389888-7b80bd0a7e3e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
    <li><img src="https://images.unsplash.com/photo-1602874268377-82a72d59ef4c?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60" alt=""></li>
  </ul>
</div>

CSS

.container {
  width: 1200px;
  margin: 0 auto;
}
.list {
  ...
}
img {
  width: 400px;
  height: 100%;
  display: block;
}

> 記得加上 CSS Reset

## 回報流程

將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔!
解答位置請參考下圖（需打開程式碼的部分觀看）


<!-- 解答：
https://codepen.io/hexschool/pen/NWYWKXP
-->

回報區
---

|#|Discord|CodePen / 答案|
|:----:|:----:|:----:|
| 1 | Jack | [Codepen](https://codepen.io/kxbhixte-the-sasster/pen/mdZebGb) |
| 2 | Lobinda | [Codepen](https://codepen.io/Lobinda/pen/wvLKwYG) |
| 3 | 毛巾 | [Codepen](https://codepen.io/bqdcjboa-the-solid/pen/MWMagPO) |
| 4 | Sammy | [Codepen](https://codepen.io/fsczdlla-the-bold/pen/poXjzqr?editors=1100) |
| 5 | NocabWang(培根) | [Codepen](https://codepen.io/PeihanWang/pen/rNEOBbv?editors=1100) |
| 5 | emmayo | [Codepen](https://codepen.io/emmayo/pen/jOjbNow) |
| 7 | Ariel | [Codepen](https://codepen.io/ariel0510/pen/NWZGKZp) |
| 8 | 俊 | [Codepen](https://codepen.io/jun12079/pen/oNrjNvr) |
| 9 | hsiu8767 | [Codepen](https://codepen.io/hsiu8767/pen/OJeyJbW) |
| 10 | GAVI | [Codepen](https://codepen.io/qbafldcv-the-scripter/pen/poXjoPV) |
| 11 | han | [Codepen](https://codepen.io/iamHanCheng/pen/abgbMpv) |
| 12 | tim | [Codepen](https://codepen.io/jskrtivy-the-animator/pen/abgoOme) |
| 13 | Dolce_墨 | [Codepen](https://codepen.io/DolceTseng1026/pen/WNqQNdM) |
| 14 | david1819 | [Codepen](https://codepen.io/David-Lin-the-vuer/pen/dyBYbEB) |
| 15 | DoryH | [Codepen](https://codepen.io/dorihung/pen/XWLmJxj) |
| 16 | Mars | [Codepen](https://codepen.io/MarsKuo/pen/YzoyPRL) |
| 17 | kawa | [Codepen](https://codepen.io/z83xji6/pen/MWMawjJ) |
| 18 | Aura Tao | [Codepen](https://codepen.io/AURATAO/pen/ZEdbGJy) |
| 19 | 泊岸 | [Codepen](https://codepen.io/qoq77416416/pen/xxowGLj?editors=1100) |
| 20 | Amy(咂摳) | [Codepen](https://codepen.io/nnxucgmc-the-builder/pen/ZEdbGMa?editors=1100) |
| 21 | neoyo | [Codepen](https://codepen.io/Neo-oo/pen/mdZeJad) |
| 22 | Yolanda | [Codepen](https://codepen.io/vcscqrtz-the-animator/pen/VwJvLEN) |
| 23 | Yoishere | [Codepen](https://codepen.io/yoishere/pen/LYKpVva) |
| 24 | Kaya | [Codepen](https://codepen.io/kayaribi/pen/WNqQQBK) |
| 25 | 陳小廷 | [Codepen](https://codepen.io/ting1124/pen/eYwppaa) |
| 26 | 楓羽兒| [Codepen](https://codepen.io/Peiyi-Lin/pen/jOjbWNQ) |
| 27 | Jim | [Codepen](https://codepen.io/JimChou/pen/abgvNvL) |
| 28 | anderson666 | [Codepen](https://codepen.io/goodmanbuild/pen/VwJvaMq) |
| 29 | brucelee0629 | [Codepen](https://codepen.io/xxhdklwi-the-decoder/pen/qBzOZKJ?editors=1100) |
| 30 | hedwig | [Codepen](https://codepen.io/adirehfz-the-encoder/pen/QWXjNgN) |
| 31 | jimmy.0706 | [Codepen](https://codepen.io/JimmyMao/pen/MWMayZO) |
| 32 | hao jing | [Codepen](https://codepen.io/hjxu/pen/yLdNRNa) |
| 33 | lunlun0514 | [Codepen](https://codepen.io/f5badapple/pen/xxowVvm?editors=1100) |
| 34 | zaoannihao | [Codepen](https://codepen.io/ckhwdvrx-the-solid/pen/bGPVwGK)
| 35 | 小咪 | [Codepen](https://codepen.io/iloveu3000x/pen/PorPGGR)
| 36 | MY | [Codepen](https://codepen.io/ahmomoz/pen/NWZGRXo) |
| 37 | chris | [Codepen](https://codepen.io/chrischen666/pen/XWLmjBK) |
| 38 | KUN. | [Codepen](https://codepen.io/barry91205/pen/OJeyRrr) |
| 39 | KevinHuang | [Codepen](https://codepen.io/qw-huang/pen/Yzoypgo?editors=1100) |
| 40 | ss585801 | [Codepen](https://codepen.io/ss585801/pen/WNqQemp?editors=1100) |
| 41 | glen_69515 |[Codepen](https://codepen.io/glenyaochih/pen/MWMaJrq)|
| 42 | Sinyi |[Codepen](https://codepen.io/sinyiii/pen/RwzWKzV)|
| 43 | ninii傳教士 |[Codepen](https://codepen.io/niiniiii/pen/JjQYWdG?editors=1100)|
| 44 | Sonia |[Codepen](https://codepen.io/YUJOU/pen/GRbpmwK)|
| 45 | 超立方體Andy |[Codepen](https://codepen.io/Andy-Yu-the-scripter/pen/NWZGgMX)|
| 46 | Anna |[Codepen](https://codepen.io/Anna-Teng/pen/VwJvMPG)|
| 47 | Kerwin | [Codepen](https://codepen.io/kerwin/pen/LYKpzQJ) |
| 48 | fendy1223 | [Codepen](https://codepen.io/fendy1223/pen/wvLKrxK?editors=1100) |
|49|Hailey|[Codepen](https://codepen.io/sxbokfja-the-flexboxer/pen/zYVvEyj)|
| 50 | Kiwi | [Codepen](https://codepen.io/kiwi1113/pen/wvLKPwz) |
| 51 | 阿蘇 | [Codepen](https://codepen.io/kukvzqps-the-solid/pen/BagomQp) |
| 52 | Theodore-0716 | [Codepen](https://codepen.io/Lobinda/pen/wvLKwYG) |
| 53 | TONY | [Codepen](https://codepen.io/Ming-Tung-Chien/pen/OJeyOrj) |
| 54 | Jainee | [Codepen](https://codepen.io/Jainee0110/pen/PorPOLK) |
| 55 | Mike | [Codepen](https://codepen.io/mike2049/pen/bGPVaGM?editors=1100) |
| 56 | Kim | [Codepen](https://codepen.io/kim0101__/pen/QWXjQLL?editors=1100) |
| 67 | 黛西 | [Codepen](https://codepen.io/ChiashengLin/pen/NWZGYya) |
| 68 | lianne._. | [Codepen](https://codepen.io/Elaina-L/pen/WNqQadQ) |
| 69 | jerry_66983 | [Codepen](https://codepen.io/Barry-C/pen/WNqQYdZ) |
| 70 | OSN |[Codepen](https://codepen.io/osncodepen/pen/LYKpMOx)|
| 71 | arvin |[Codepen](https://codepen.io/arvinyang1925/pen/YzoyBrR)|
| 72 | Yunya | [Codepen](https://codepen.io/cookie1515/pen/zYVrYyX) |
| 73 | 皮皮 | [Codepen](https://codepen.io/rainbow-the-reactor/pen/eYwJmKm) |
| 74 | xiang | [Codepen](https://codepen.io/XIANG-XIANG/pen/rNExVNL) |
| 75 | Chuang | [Codepen](https://codepen.io/uidoytjq-the-solid/pen/qBzbdEX) |
| 76 | ya_meow |[Codepen](https://codepen.io/gkfxzvcb-the-bashful/pen/KKjVpKK)|
| 77 | xcx100 | [Codepen](https://codepen.io/c13026/pen/OJeMXBp) |
| 78 | macihuang | [Codepen](https://codepen.io/macy1215/pen/MWzGqjd) |
| 79 | yaoling.liang | [Codepen](https://codepen.io/Yao-Ling-L-/pen/poXgEWY)
| 80 | fan_fan | [Codepen](https://codepen.io/fan1102/pen/LYKGRMy) |
| 81 | mindful7755(toro) | [Codepen](https://codepen.io/andawu/pen/LYKGbgB) |
| 82 | PoWei | [Codepen](https://codepen.io/Po-Wei-Lai/pen/QWXyqNe) |
| 83 | Noelle | [Codepen](https://codepen.io/NoelleKH/pen/wvLMXRv) |
| 84 | 咖 | [Codepen](https://codepen.io/daru-Ga/pen/WNqrrRg) |
| 85 |邵|[Codepen](https://codepen.io/ukscrlno-the-typescripter/pen/rNExEMp)|
| 86 | Steven1220 |[Codepen](https://codepen.io/Steven1220/pen/MWMKMPV)|
| 87 | wind | [Codepen](https://codepen.io/wind7y/pen/JjQXdEN) |
| 88 | n913239 | [Codepen](https://codepen.io/n913239/pen/GRbZPQW) |
| 89 | Kai | [Codepen](https://codepen.io/beginneraboutlife116/pen/ExBKrYj) |
| 90 | Enn | [Codepen](https://codepen.io/enntang/pen/KKjMPPJ) |
| 91 | harrytsai_ht | [Codepen](https://codepen.io/sffkurga-the-solid/pen/jOjrNQO) |
| 92 | EdHuang | [Codepen](https://codepen.io/yide1986/pen/QWXEKKq) |
| 93 | jasonlin | [Codepen](https://codepen.io/gfswkraq-the-reactor/pen/ExByQKj) |
| 94 | 嚼勁先生 | [Codepen](https://codepen.io/James520284/pen/rNELvvo) |
| 95 | ho_yc | [Codepen](https://codepen.io/Ho_HYC/pen/xxoOvpe) |
| 96 | 地瓜 | [Codepen](https://codepen.io/huangtzuchin/pen/oNrzNPa) |
| 97 | skyderry | [Codepen](https://codepen.io/hvvjvkva-the-sasster/pen/mdZrexo) |
| 98 | 雪粒 | [Codepen](https://codepen.io/bzykdfhw-the-bashful/pen/abgmNLv) |
| 99 | Joanne hu | [Codepen](https://codepen.io/nelbabkv-the-flexboxer/pen/OJeRzwb) |
| 100 | zen | [Codepen](https://codepen.io/zen742937/pen/eYwBOdx) |
| 101 | 610 | [Codepen](https://codepen.io/YI-LING-LIU/pen/abgBPxQ) |
| 102 | eddiesun0526 | [Codepen](https://codepen.io/Eddie0526/pen/MWMbRgj)|
| 103 | Chieh | [Codepen](https://codepen.io/Chieh_/pen/abgBgBZ?editors=1100)|
| 104 | Antonio | [Codepen](https://codepen.io/gwhvusel-the-builder/pen/XWLMGEr)|
| 105 | Toung | [Codepen](https://codepen.io/Toung/pen/WNqjzgK) |
| 106 | 小翎 | [Codepen](https://codepen.io/debbielin/pen/abgWXxQ?editors=1100) |
| 107 | qet1717 | [Codepen](https://codepen.io/gwteqexi-the-bold/pen/abgwOzL) |
| 108 | Emma | [Codepen](https://codepen.io/Emma0919/pen/JjQyGYd) |
| 109 | Judy | [Codepen](https://codepen.io/yangchi/pen/LYKOmvp) |
| 110 | 野鴿 | [Codepen](https://codepen.io/HoshinoSyouta/pen/abgEzwX) |
| 111 | ji3di | [Codepen](https://codepen.io/jwuuhtxh-the-builder/pen/bGPvyqq) |
| 112 | tung | [Codepen](https://codepen.io/ru-ching/pen/eYwKGzG) |
| 113 | 深海 | [Codepen](https://codepen.io/KAI-SHIN-the-animator/pen/mdZQEgy) |
| 114 | KOMATSU PEI | [Codepen](https://codepen.io/Komatsu2021/pen/KKjYRWp?editors=1100) |
| 115 | Lotte | [Codepen](https://codepen.io/hmkdoxuj-the-decoder/pen/OJeYMxq?editors=1100) |
| 116 | Angela-la | [Codepen](https://codepen.io/Angela-the-builder/pen/oNKoxPV?editors=1100) |
<!--
| No | Discord | [Codepen]() |
-->