Sudoku Challenge Part 1

[tacit spear]

https://codepen.io/ShimonM/pen/raeopYK

[tacit spear]

@fleet shuttle I see that my submission wasn’t commented on. Was it missed?

[fleet shuttle]

I did not comment because i had nothing to say (for now). I have a few things to tell you when the event is over 🙂

[tacit spear]

Okay, thank you. Just got nervous as it was the only one without comment.

[mild girder]

@tacit spear Alright... So now that the event is over, i can give you a few recommendations...
for grid-template-columns you can use the repeat() function. And i would rather use the fr unit.

So you could write grid-template-colums:repeat(3, 1fr);.
This is the same as if you wrote grid-template-columns:1fr 1fr 1fr;

Also, you don't need grid-template-rows here. You should not use grid-template-rows unless you have rows with different heights, for example if you want first row to be auto, second row to be 50px and third row to be 1fr. In this case you need to use grid-template-rows. But otherwise you should not include it.

This is how i do the Discord Board

[tacit spear]

Thank you for your tips. As a self-taught (W3 Schools and more) junior level coder, I appreciate any advice and tips that I can get. One question on your code. You created the HTML with a function. Wouldn't it be better to create each one manually so when we add the functionality to the game each square can have its own id? (This actually led me to my rookie mistake. I was so busy thinking that I shouldn't use a function to create the HTML elements that I thought not to use a repeat function for the CSS, as well.)