I have a grid with some squares which looks like this: screenshot 1
The container CSS of it:
.right-grid-container {
padding: 0.5vh 0.6vh 0.5vh 0.6vh;
border-radius: 0.25vw;
border: 0.15vw solid #ffffff10;
position: absolute;
bottom: 2vh;
right: 1vw;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
column-gap: 1vh;
row-gap: 0.7vh;
overflow-x: hidden;
height: 57vh;
background-color: rgba(0, 0, 0, 0.29);
}
I want to have elements positioned like in this picture: screenshot 2 What I'm doing wrong? I already tried with align-content / align-items but is not working.
