@correlucas
Posted
👾Hello Mirosław, Congratulations on completing this challenge!
I saw your solution preview site and I think it's already really good. Here’s some tips for you to improve it:
To clean your code and use a shortcut to place the images mobile + desktop without need of any media query, use the tag <picture> instead of two <img> wrapped in a div or using background-image. Look that for SEO and search engine reasons it isn't a better practice to import this product image with CSS since this will make harder to the image be found. You can manage both images inside the <picture> tag and use the html to code to set when the images should change setting the device max-width depending of the device (phone / computer) Here’s a guide about how to use picture: https://www.w3schools.com/tags/tag_picture.asp
✌️ I hope this helps you and happy coding!
Marked as helpful
@miroslaw-mroczkowski
Posted
@correlucas Hi Lucas, thank you very much for your feedback and tips :)
@correlucas
Posted
@miroslaw-mroczkowski Then say me if works! Happy coding
@miroslaw-mroczkowski
Posted
@correlucas Hi Lucas, it works really nice :) thanks I have one question. How can I place a shade on picture element? Pseudo-element, or is there something else? Till now only pseudo works but between picture and card body there's a thin line. Thank you :)
