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 component | HTML & CSS

#accessibility
Ahlam 350

@AhlamAb22

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


I finished this challenge using HTML and CSS. I tried to pay attention to details and work in an organized way. I would love to receive your feedback!

Community feedback

@HusseinSamy

Posted

Hello @AhlamAb22, 👋🏻

Awesome job on taking the first steps towards your dream!

I'm thrilled to see your engagement with this platform to enhance your design skills. good job on giving web accessibility a priority in your styles. Though, I have some additions to make more clean:

1.Add meta tags to your project:

<meta name="title" content="My Website">
<meta name="description" content="My Website Description">
<meta name="keywords" content="Some, Keywords, Here">

2.Use the clamp() method to resize the text based on the viewport width.

Hope you find it useful!😇

Keep up the fantastic work, and happy coding! 🚀

Marked as helpful

0

Ahlam 350

@AhlamAb22

Posted

@HusseinSamy Thank you! I will work on that. This is the second comment I've received about 'clamp()', so I am going to learn more about it and use it in my solutions.

0

@HusseinSamy

Posted

@AhlamAb22 Wish you all the best! ✨

1

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