Responsive 3 column preview card component

The container is not responsive yet as it is not looking okay on larger screens. to make it responsive, .container{ display: flex; flex-direction:row; }

then add other stylings like adjusting the attribution and all. this should help also

Hello there 👋. You did a good job!

• Hover on Button there is border so height and width increased of whole card. This is not well, you can do this

    background-color: $Very-light-gray;
    padding: 1.1875rem 2rem;
    margin-top: 1.875rem; // 30px;
    border: 2px solid $Very-light-gray;
    outline: none;
    font-weight: 400;
    border-radius: 30px;
    cursor: pointer;
    font-size: 0.8rem;
    transition: background 0.1s ease-in;

    &:hover {
        background: transparent;
        color: $Very-light-gray !important;
    }
}

• To understand better go to my solution maybe you can find it useful click here. I hope you find this helpful.