The last row that will not line up
flex-wrap: wrap and justify-content: space-between make a perfectly good gallery — until the last row has two photos in it instead of three, and they fly to opposite ends of the gallery.
Five 200px tiles in a 640px gallery with a 10px gutter, and justify-content: space-between in the base stylesheet. Three fit on a row and 20px is left over, which is fine.
Make the last two tiles line up under the first two of the row above — tile 4 at the left edge, tile 5 one gutter along — with the tiles still exactly 200px and the leftover space at the end of each row.
Try to fix the starter with a different distribution keyword first. It is worth finding out that none of them work.
Hint
`space-between` is applied to a line. How many items are on the last line, and what does the keyword have to work with there that it does not have on the first?
The fixture — markup and base stylesheet
You cannot change either of these. They are what your selectors have to reach, and they are the same ones the judge renders.
<div class="gallery"><div class="t t1"></div><div class="t t2"></div><div class="t t3"></div><div class="t t4"></div><div class="t t5"></div></div>
*, *::before, *::after { box-sizing: border-box; } html, body { margin: 0; padding: 0; } body { background: #0b0b0f; } .gallery { width: 640px; display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; background: #16161d; } .t { flex: 0 0 200px; width: 200px; height: 120px; background: #7bdff2; } .t4, .t5 { background: #b5e48c; }