responsive grid box using css

Hi @Quantom223,

Good job on your first attempt

To center the card in the middle of the page you can make the following changes to you body rule in the media query.

@media screen and (min-width: 601px) {
body {
    width: 600px;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
}

and the button is missing padding on mobile because you're only adding the padding in the min-width:601px media. you can add the padding padding: 0.8rem; on the .addToCart class outside the media query and both mobile and desktop will have padding.

Hope this is helpful.

Thank you sir, it was helpful. the card centered to the middle, And the button are fixed too