yatzee css html 100%

This commit is contained in:
chris 2024-06-10 10:42:07 -04:00
parent 603f31bb19
commit 3fd3f7c280

View File

@ -1,68 +1,71 @@
#highScore{
text-align: center;
#highScore {
text-align: center;
}
header{
margin: auto;
text-align: center;
header {
margin: auto;
text-align: center;
}
#diceBoard{
width: 85%;
height: 150px;
background-color: blueviolet;
border: 2px solid black;
margin: auto;
display: flex;
justify-content: space-evenly;
padding: .5rem;
flex-wrap: nowrap;
border-radius: 10px;
html {
height: 100%;
}
#scoreBoard{
width: 85%;
height: 300px;
background-color: rgb(226, 192, 43);
border: 3px dotted black;
margin: auto;
#diceBoard {
width: 85%;
height: 150px;
background-color: blueviolet;
border: 2px solid black;
margin: auto;
display: flex;
justify-content: space-evenly;
padding: 0.5rem;
flex-wrap: nowrap;
border-radius: 10px;
}
#diceBoard img{
height: 3rem;
#scoreBoard {
width: 85%;
height: 300px;
background-color: rgb(226, 192, 43);
border: 3px dotted black;
margin: auto;
}
.dice_pic_hold{
align-self: flex-end;
order: -1;
#diceBoard img {
height: 3rem;
}
#game{
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
gap: 1rem;
.dice_pic_hold {
align-self: flex-end;
order: -1;
}
#roll{
padding: 2rem;
color: white;
background-color: rgb(50, 68, 83);
border-radius: 25%;
box-shadow: 2px 2px gray;
#game {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
gap: 1rem;
}
#roll {
padding: 2rem;
color: white;
background-color: rgb(50, 68, 83);
border-radius: 25%;
box-shadow: 2px 2px gray;
}
#upper{
display: flex;
justify-content: space-around;
align-items:center;
width: 100%;
border: 1px solid black;
flex-wrap: wrap;
#upper {
display: flex;
justify-content: space-around;
align-items: center;
width: 100%;
border: 1px solid black;
flex-wrap: wrap;
}
.upperScore{
height: 30px;
background-color: brown;
/* border: 2px solid black; */
width: 16.66px;
/* display: none; */
.upperScore {
height: 30px;
background-color: brown;
/* border: 2px solid black; */
width: 16.66px;
/* display: none; */
}
.upperLable{
flex-wrap: wrap;
/* width: 100%; */
.upperLable {
flex-wrap: wrap;
/* width: 100%; */
}