Build it

The same tiles, keeping the widths the design gave them

EasySizing

flex: 1 made the tiles equal and threw away the 120/200/160 widths in the design file. The tiles are supposed to keep those proportions and still fill the row.

Each tile in .stats starts from the width in the stylesheet — 120, 200 and 160 — and takes an equal share of whatever is left over. At 720px that comes out 192, 272 and 232.

Hint

Same grow factor and same shrink factor as the last drill. Only one of the three values has to change — which one decides where each tile starts from?

Live preview1000×700

Your stylesheet

checked in a real browser, four ways

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="stats"><div class="tile t1">Users</div><div class="tile t2">MRR</div><div class="tile t3">Churn</div></div>

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: #0b0b0f; color: #e8e8ef; font: 16px/1.4 system-ui, -apple-system, sans-serif; }
.stats { width: 720px; height: 140px; background: #0f0f14; display: flex; gap: 12px; }
.tile { height: 140px; padding: 12px; background: #16161d; }
.t1 { width: 120px; }
.t2 { width: 200px; }
.t3 { width: 160px; }