Semantic HTML5 markup CSS custom properties Flexbox Media query

Greetings @SAAJEVES,

congratulations on finishing the challenge, great work 👏

I have some tips to help you create a better responsive card:

• First, it's preferable to use "classes" instead of "id"s to use in the stylesheet, that's because of several reasons mentioned in this article.
• also, the > CSS selector has it's use cases, you can read on them in MDN here.
• the most annoying problem for me when I first tried to make a responsive website was that I set the width an height of an element in "pixels", and this is not correct because maybe my friend's screen size is bigger or smaller than mine, so the website will be different from what I coded for him

solution ?? I would suggest that you read this article, and this also, they are relative so if you understand the frist, it won't take much time to understand the second.

• finall, try to use meaningful class names in addition to wirting comments so you can navigate through and read your code easily.

and that's it, I hope my tips will be useful to you, keep up awesome work, practice more and happy coding 😀