Skip to content

Instantly share code, notes, and snippets.

@chrisvasey
Created April 21, 2020 14:03
Show Gist options
  • Save chrisvasey/b177c57e8168391be499eff2d9816288 to your computer and use it in GitHub Desktop.
Save chrisvasey/b177c57e8168391be499eff2d9816288 to your computer and use it in GitHub Desktop.
#stage {
display: block;
margin-left: auto;
margin-right: auto;
height: 500px;
width: 500px;
padding: 50px;
border: 2px solid black;
}
.gallows {
position: relative;
}
.gallows {
height: 100%;
width: 100%;
border-bottom: 4px solid black;
border-left: 4px solid black;
}
.gallows .gallows-top {
position: absolute;
top: 0;
width: 50%;
border-top: 4px solid black;
}
.gallows .gallows-rope {
display: block;
margin-left: auto;
margin-right: auto;
width: 4px;
height: 45px;
background: black;
}
.man-head {
display: block;
margin-left: auto;
margin-right: auto;
height: 60px;
width: 60px;
border-radius: 60px;
border: 4px solid black;
}
.man-body {
display: block;
margin-left: auto;
margin-right: auto;
height: 100px;
width: 4px;
background: black;
}
.man-arm-left {
position: absolute;
transform: rotate(40deg);
height: 50px;
margin-top: -6px;
margin-left: -15px;
width: 4px;
background: black;
}
.man-arm-right {
position: absolute;
transform: rotate(-40deg);
height: 50px;
margin-top: -6px;
margin-left: 15px;
width: 4px;
background: black;
}
.man-legs {
display: block;
margin-left: auto;
margin-right: auto;
width: 35px;
margin-top: -7px;
}
.man-leg-left {
position: absolute;
transform: rotate(40deg);
height: 50px;
width: 4px;
background: black;
}
.man-leg-right {
position: absolute;
transform: rotate(-40deg);
height: 50px;
margin-left: 30px;
width: 4px;
background: black;
}
.form {
display: block;
margin-left: auto;
margin-right: auto;
}
#guessInput {
max-width: 400px;
text-align: center;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment