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

Perfume Product Card

totorocod 70

@totorocod

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?

One of the aspects I'm most proud of is the use of CSS variables to define and maintain a consistent color scheme throughout the page. This not only made the styling process more efficient but also allowed for easy customization and consistency across the site.

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

I had difficulty in aligning the card vertically. I solved it by using flex and setting the flex direction to column. Next, I used align-content: center and justicy-content: center to align the card vertically and horizontally center.

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

I still need more help in achieving consistency in design across my project. This includes maintaining spacing and overall visual appeal. I would appreciate guidance on how to improve the consistency and polish of my design.

Community feedback

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