Tic Tac Toe
Output Readme Download Replit Sel. & Copy Full

Create a CSS only tic-tac-toe bot. To just worry about the AI, you only need to edit the ai.css file.

Manipulate the z-index of the elements of the form "label[for=c-{r}-{c}-o].o2" where the {r} should be replaced by the row (1, 2, or 3) and {c} replaced by the column (1, 2, or 3). Highest z-index will be the move that is performed when clicking the stack of buttons.

You can use variables, calc, min/max to set z-index based on whatever criteria performs best. You may wish to use some sort of template system to eliminate lots of copy/pasting.

Read this blog post about Fox and Geese CSS challenges or visit CSSHole for more CSS only projects.