Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Product preview card

Rodri 100

@rcsilva211

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I was able to revise and use on both width and height, as well as use calc to have responsive font-sizes, as well clamp on both the width and height, and all this combined has made me see that it did a much better job on responsiveness.

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

Definitely doing responsivess from scratch. I understand the main concept, but I think I've written a lot more lines than originally necessary. Other than that, the concepts are pretty clear to me.

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

Help in recognizing where I could've done better or how in terms of the code done. Exe: what could I do to make everything more responsive in less lines of code.

Community feedback

Juriya 140

@juriya

Posted

Congratulations on the solid solution!

It could benefit from using semantic HTML elements like <main> and <section> instead of relying solely on <div> tags for better accessibility and structure. Overall, the layout is good, but incorporating semantic elements would enhance readability and alignment with best practices.

0

Rodri 100

@rcsilva211

Posted

@juriya Much appreciated, will look at it and improve on the way I apply it!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord