90 lines
1.1 KiB
CSS
90 lines
1.1 KiB
CSS
body {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 480px);
|
|
grid-template-rows: repeat(5, 540px);
|
|
}
|
|
.calcolatrice {
|
|
grid-area: 1 / 2 / 1 / 4;
|
|
border: 2px solid blue;
|
|
width: 50%;
|
|
padding-left: 29%;
|
|
padding-right: 20%;
|
|
padding-top: 4%;
|
|
}
|
|
|
|
.pulsanti {
|
|
border: 2px solid red;
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 50px);
|
|
grid-template-rows: repeat(5, 50px);
|
|
grid-column-gap: 50px;
|
|
grid-row-gap: 50px;
|
|
}
|
|
#output {
|
|
grid-area: 1 / 1 / 1 / 5;
|
|
}
|
|
|
|
#sette {
|
|
grid-area: 2 / 1 / 3 / 2;
|
|
}
|
|
|
|
#otto {
|
|
grid-area: 2 / 2 / 3 / 3;
|
|
}
|
|
|
|
#nove {
|
|
grid-area: 2 / 3 / 3 / 4;
|
|
}
|
|
|
|
#diviso {
|
|
grid-area: 2 / 4 / 3 / 5;
|
|
}
|
|
|
|
#quattro {
|
|
grid-area: 3 / 1 / 4 / 2;
|
|
}
|
|
|
|
#cinque {
|
|
grid-area: 3 / 2 / 4 / 3;
|
|
}
|
|
|
|
#sei {
|
|
grid-area: 3 / 3 / 4 / 4;
|
|
}
|
|
|
|
#per {
|
|
grid-area: 3 / 4 / 4 / 5;
|
|
}
|
|
|
|
#uno {
|
|
grid-area: 4 / 1 / 5 / 2;
|
|
}
|
|
|
|
#due {
|
|
grid-area: 4 / 2 / 5 / 3;
|
|
}
|
|
|
|
#tre {
|
|
grid-area: 4 / 3 / 5 / 4;
|
|
}
|
|
|
|
#meno {
|
|
grid-area: 4 / 4 / 5 / 5;
|
|
}
|
|
|
|
#zero {
|
|
grid-area: 5 / 1 / 6 / 2;
|
|
}
|
|
|
|
#virgola {
|
|
grid-area: 5 / 2 / 6 / 3;
|
|
}
|
|
|
|
#uguale {
|
|
grid-area: 5 / 3 / 6 / 4;
|
|
}
|
|
|
|
#più {
|
|
grid-area: 5 / 4 / 6 / 5;
|
|
}
|