Product preview card component

Hey there! 👋 Here are some suggestions to help improve your code:

• The Alt Tag Description for the image needs to be improved upon. You want to describe what the image is; they need to be readable. Assume you’re describing the image to someone.

• This challenges requires the use of two images 🎑 for different breakpoints. The Picture Element will facilitate this.

Here is an example of how it works: EXAMPLE

Syntax:

  <picture>
    <source media="(min-width: )" srcset="">
    <img src="" alt="">
  </picture>

More Info:

https://www.w3schools.com/html/html_images_picture.asp

https://web.dev/learn/design/picture-element/

If you have any questions or need further clarification, let me know.

Happy Coding! 👻🎃

Congratulations for finishing this challenge.

Your result is totally fine, but there's some area of improvement

1. Don't forget the semantic HTML

Instead of using <div class="container"> in the opening content tag, it's better to use <main class="container"> as it's semantically correct, and will help the reader with visual impairment to browse the main content of your website.

1. And because this project require us to make a responsive website, it's better if you start using relative unit especially rem and em.

2. And for more best practice, I think you better link all the google fonts and fontawesome cdn through link in the HTML head rather than importing through CSS (personal opinion though).

Overall, nice work, and can't wait for your next project submission.