Starting work on the tic tac toe project, I’ve come across a problem where the cells would stretch when I try to input things in it. How do I keep the size of them fixed? I’m trying “table-layout: fixed;” and it still doesn’t work for me.
In addition to @SkyC’s comment, I’ll mention that vertical-align
was designed for table cells. So, you could get away with fixed width and height while centering in both horizontally and vertically.
td {
border: 1px solid black;
width: 80px;height: 80px;
font-size: 30px;
/* these will center vertically and horizontally */
text-align: center;
vertical-align: middle;
}
And, to match up the div comment, you can set a series of divs to display:table-cell
, but I think using display:flex
will give you more control. All the above will work for you.
2 Likes
And just like that, the problem is resolved. Thank you both for your help!