Responsive using sass and media quieries, plis feedback🙏

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

• The article and section elements are being used incorrectly ❌ and not needed for this challenge .

• The image’s alt tag description needs to be improved upon ⚠️. Assume that you are describing the image to a someone over the phone.

More Info:📚

https://www.w3.org/WAI/tutorials/images/

• This component requires the use of two images 🎑 at different breakpoints ⚠️. The picture element will facilitate this.

Syntax:

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

More Info:📚

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

• The only heading ⚠️ in this component, is the name of the perfume; “Gabrielle Essence Eau De Parfum” . The rest of the text should be wrapped in a paragraph element.

• Currently, the old price (169.99) 🏷 is not being properly announced 😢 to screen readers. To fix this, you are going to wrap the the price in a del element and inside it you will add a span element with an sr-only class that will state something like “The previous price was…” and use CSS to make it only visible to screen readers.

More Info:📚

Del Element

If you have any questions or need further clarification, feel free to reach out to me.

Happy Coding! 🎆🎊🪅

hey Eduardo Daniel 😄,I have inspected your code and previewed your site.

1. you should not specify the img height along with width:100% the width:100% is enough.because you have used height and width the image seems streched.
2. as far as the media queries they are working fine hope my this helps you ..let me know if you need anymore help happy coding🔥🔥
3. firtsly you have used the image tag and gave source set which is not a valid html you can use picture element like this .

 <picture>
  <source media="(min-width: 650px)" srcset="img_food.jpg">
  <source media="(min-width: 465px)" srcset="img_car.jpg">
  <img src="img_girl.jpg">
</picture>