Yatay çizgiler de aynı kalıbı izler; sadece yatay ile dikey yer değiştirir. Dikey çizgi "x'te ince, boyu tahta
kadar"dı; yatay çizgi "y'de ince, eni tahta kadar" olacak.
Döngüye tek bir satır ekliyoruz ve ızgara bitiyor: dokuz kutu.
```js
for (let i = 1; i < 3; i++) {
ctx.fillRect(i * CELL - 2, 0, 4, canvas.height)
ctx.fillRect(0, i * CELL - 2, canvas.width, 4)
}
```
Ne işe yarıyor
ctx.fillRect(0, i * CELL - 2, canvas.width, 4) → yeni satır:
0 → sol kenardan başlar.
i * CELL - 2 → y: 98 ya da 198. Bu sefer ortalanan y.
canvas.width, 4 → tahta eninde, 4 piksel boyunda.
Döngünün her turu artık bir dikey, bir yatay çizgi çiziyor. İki tur × iki çizgi = dört çizgi.
Sıra sende
Döngünün içinde, dikey çizgiyi çizen ctx.fillRect(i * CELL - 2, ...) satırının altına yeni satırı yaz. Çalıştır: tahta dokuz kutuya bölünmeli.