basically title. Here is the code:
body {
margin: 0;
padding: 0;
width: 100vw;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background-color: red;
}
#gameboard {
justify-content: center;
align-items: center;
display: grid;
background-color: blue;
border: 1px solid black;
width: 500px;
height: 500px;
grid-template-columns: repeat(8, 1fr);
grid-template-rows: repeat(8, 1fr);
}<!DOCTYPE html>
<html>
<head>
<link rel = "stylesheet" type = "text/css" href="css.css">
</head>
<body>
<div id = "gameboard"></div>
</body>
<script type = "text/javascript" src = "js.js"></script>
</html>If you go to a full page in the snippet, you will see a grid that is 8x8 - how do I give each column and row a black border (kind of like a checker game board has)?
Thanks in advance!!
