CSS grid, Layout

Hi @Hicham2012!

Well done on your first challenge here, good job!

You could improve the code a bit, by only using one div or main as container element and position everything inside of it. For this challenge, no more divs are needed. This will make it simpler for you to code and more readable for the future, if you work within a team.

I also suggest getting comfortable with using rem and em units instead of px, as these are scalable and will make everything easier in terms of responsiveness.

Hope this helps.

Great job again on the first challenge, can't wait to see more!

Happy coding and happy weekend :)

Patrick

Hi @Hicham2012,

congrats on completing the challenge just a tip, you can add the following to center the card vertically and horizontally on the page.

body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    margin: 0;
}