Bootstrap CSS HTML

👾Hello Mal Thidar, congratulations for your new solution!

❓ Answering your question:

To make these column centered and not growing more than it should use align-items: center; inside .grid-container

.grid-container {
    margin-top: 100px;
    width: 75%;
    color: white;
    height: 100vh;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    /* grid-template-rows: repeat(2,1fr); */
    grid-template-areas:
        "item1 item1 item2 item3"
        "item4 item5 item5 item3";
    gap: 20px;
    margin-bottom: 20px;
    align-items: center;
}

✌️ I hope this helps you and happy coding!