Product preview card

Instead of using margins for centering you should use flexbox so it's in the middle of the screen at all screen sizes. Use this instead:

min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;

You can learn about Flexbox here and here. For learning CSS in general I recommend Kevin Powell's channel and his course on responsive design. You can also take a look at my solution.

Hello, Vlad!👋

Congratulations for completing another challenge. You did a good job nailing the design😊

A few basic things I would suggest to improve your solution:

• Consider implementing semantic HTML tags, such as: <header></header>, <main></main>, <footer></footer> in order to give a more meaningful structure to your code. Your can read more about it here 👉Semantic HTML5 Elements Explained.
• Be mindful about closing all your tags.
• Try to make your website responsive by using relative units like rem or em, especially on font sizes and also providing the right layout depending on screen size. For this I would suggest checking out the basics of media queries (i.e. @media (min-width...)). More on that here 👉 Responsive Web Design - Media Queries.

Hope this all helps you and happy coding!😎