Building tic-tac-toe with react. How to adjust square size?

So I’m working through this React introductory tutorial linked above and I’m trying to implement a few changes of my own

Code: https://codepen.io/gaearon/pen/KmmrBy?editors=0010

How would I make the squares bigger and change the colours of the X’s & O’s?

There is a width and height on the .square selector you can use, you can also set the color using that same selector.

1 Like

Add a className property to the <Square> component:

<Square className='square'
        value={this.state.squares[i]}
        onClick={() => this.handleClick(i)}
/>
1 Like