HTML Can't Change Height of Div

Answer 1

That is because you don't have a height to the board and the 30% of almost 0 is... 0.

Add some height to the div with the id of board.

Add this to your css:

html {
  background-color:black;
  color:white;
  text-align:center;
}
#board{
 height:300px;
}
.cell {
  border: 1px solid white;
  margin:1px;
  width:30%;height:30%;
}

Answer 2

html, body { height: 100%; }
#board { display: block; margin: auto auto; min-height: 100%; }

To use percentages your html and body both need to be height 100% then your outer container (assuming it is #board here) needs to specify min-height to fill the document, and be display type of block.