Frontend Mentor | pablodev | Product Preview Solution coding challenge solution

Solution retrospective

What are you most proud of, and what would you do differently next time?

whats up guys! ✨

This solution was a little different from the others I've done so far, which made me learn a new way of doing "a responsive way" I learned to use media query to provide responsiveness to different devices.

What challenges did you encounter, and how did you overcome them?

I found a limitation in my codes of using relative measurements such as vw, vh, em and others. I'm not yet familiar with these measurements, but I hope to improve my way of building responsive websites.

What specific areas of your project would you like help with?

I think that, I have to improve my lines of code.

And start to use relatives measures!

thank you guys

Community feedback

Abdul Khaliq 🚀• 72,660

@0xabdulkhaliq

Posted 4 months ago

Hello there 👋. Congratulations on successfully completing the challenge! 🎉

I have a suggestion regarding your code that I believe will be of great interest to you.

HTML 🏷️:

The <span>PERFUME</span>, must want to be changed to normal case like Perfume

It’s not great for screen readers, because uppercase text will be read out as individual letters (like abbreviations). So CSS is read as C.S.S. Just as PERFUME would be read as P.E.R.F.U.M.E, not as the word "Perfume"

You can read more about that in this article on Medium

Don't worry we can use text-transform: uppercase to transform the letter and letter-spacing: 1rem for the text Perfume

If you have any questions or need further clarification, you can always check out my submission and/or feel free to reach out to me.

Additionally, you need to update the Preview Site as "https://pabloodev.github.io/product-preview-card/". Seems like you updated your repository name but you forget to update the preview link so that this is happening. Please do update so that it could help other reviewers!

I hope you find this helpful 😄 Above all, the solution you submitted is great !

Happy coding!

Marked as helpful

pablodev• 430

@Pabloodev

Posted 4 months ago

@0xabdulkhalid

Wow, what a complete comment! ⭐

Thank you very much friend 💙, I think I missed some of the semantics in my first span lol

I updated the links too, thanks again

pablodev | Product Preview Solution

Design comparison

Solution retrospective

Community feedback

Please log in to post a comment

Join our Discord community