Skip to content

Instantly share code, notes, and snippets.

@JesterMan
Created December 20, 2013 05:30
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save JesterMan/8050772 to your computer and use it in GitHub Desktop.
Save JesterMan/8050772 to your computer and use it in GitHub Desktop.
tic tac toe
#board {
width: 300px;
height: 300px;
position: relative;
}
.square {
height: 100px;
width: 100px;
position: absolute;
}
.top {
border-bottom: 2px solid black;
}
.bot {
border-top: 2px solid black;
}
.c {
border-left: 4px solid black;
border-right: 4px solid black;
}
.l {
left: 0px;
}
.c {
left: 100px;
}
.r {
left: 204px;
}
.top {
top: 0px;
}
.mid {
top: 102px;
}
.bot {
top: 202px;
}
<!doctype=html>
<head>
<meta charset="UTF-8">
<title>Three in a Row</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id = "board">
<div class="square top l"></div>
<div class="square top c"></div>
<div class="square top r"></div>
<div class="square mid l"></div>
<div class="square mid c"></div>
<div class="square mid r"></div>
<div class="square bot l"></div>
<div class="square bot c"></div>
<div class="square bot r"></div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment