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 with SCSS and Flexbox

mihai2537 190

@mihai3636

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'm proud of finding out a formula for my scss skeleton and for establishing a set of css variables.

Next time I would pay more attention to the design details as this time I wanted to make use of my variables and nothing else.

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

I had a little bit of a struggle with setting the size of the image and of the flex container but eventually I picked them one by one and they all made sense.

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

Hello everyone!

Any feedback is greatly appreciated, I'm eager to hear how could I improve my scss.

Thanks a lot!

Community feedback

@R3ygoski

Posted

Hello Mihai, congrats for finish this challenge.

First about your SCSS, this structure that you adopted is very organized and it's right.

Now a tip about your HTML, <div class="product-info"> here you could use and <article> tag to make it more Semantic.

Your project is very good in many ways, congrats!

Marked as helpful

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