Task 4: Playing cards

This commit is contained in:
Brikt Wiedswang
2025-10-02 16:28:52 +02:00
parent 57e3a3cae4
commit c67ec16e5e

View File

@@ -53,23 +53,48 @@
}
.card {
display: inline-flex;
display: flex;
justify-content: space-between;
flex-direction: column;
width: 12em;
height: 18em;
flex-direction: row;
width: 300px;
height: 450px;
border: 1px solid black;
border-radius: 5px;
font-family: monospace;
font-size: 32px;
}
.container>.card>.middle {
display: grid;
text-align: center;
grid-template-columns: repeat(2, 50% [col-start]);
font-size: 3em;
align-items: center;
grid-template-columns: repeat(2, 96px [col-start]);
font-size: 64px;
}
.container>.card.>.left {
.container>.card>.middle>div:nth-last-child(2) {
transform: rotate(0.5turn);
}
.container>.card.>.right {
text-align: center;
.container>.card>.middle>div:nth-last-child(1) {
transform: rotate(0.5turn);
}
.container>.card>.right {
text-align: left;
transform: rotate(0.5turn);
padding: 1em 0em 0em 1em;
}
.container>.card>.center {
font-size: 128px;
align-items: center;
display: flex;
}
.container>.card>.bottom {
text-align: left;
transform: rotate(0.5turn);
padding: 1em 0em 0em 1em;
}
.container>.card>.top {
padding: 1em 0em 0em 1em;
}
.container>.card>.left {
padding: 1em;
padding: 1em 0em 0em 1em;
}