php-chess/html/static/styles.css

* {
    box-sizing: border-box;
}

.board {
    width: 400px;
    height: 400px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
}

.square {
    width: 12.5%;
    height: 12.5%;
}

.square.black {
    background-color: brown;
}

.square.white {
    background-color: lightgoldenrodyellow;
}

.square.black.hasMoves {
    background-color: green;
}

.square.white.hasMoves {
    background-color: greenyellow;
}

.piece {
    width: 100%;
    height: 100%;
    position: relative;
}

.piece img {
    width: 100%;
    z-index: 10;
}