Home

Published

- 1 min read

how to use html and css to design a chess board

img of how to use html and css to design a chess board

The solution for this is noted below

how to use html and css to design a chess board

Solution

   body {
	background: #e8e7de;
	font-family: 'Montserrat', sans-serif;
}
.chessboard {
	width: 640px;
	height: 640px;
	margin: 20px;
	border: 10px solid #000;
	border-radius: 4px;
	background: #e59110;
	box-shadow:
		5px 5px 8px #bebdb6,
		-5px -5px 8px #ffffff;
}
.black {
	float: left;
	width: 80px;
	height: 80px;
	background-color: #e59110;
	font-size: 50px;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
}
.white {
	float: left;
	width: 80px;
	height: 80px;
	background-color: #ffcfb6;
	font-size: 50px;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
}

Try other methods by searching on the site. That is if this doesn’t work