Product view card using HTML and CSS

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

I'm proud of learning new functions like ´clamp()´ and achieving results that closely match my goals. Next time, I’ll challenge myself further by incorporating a framework like Less or Sass to streamline the process and enhance efficiency.

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

One of the challenges I faced was creating the border radius. I initially forgot how to do it and spent some time applying the border to the container, but it wasn’t working. The issue was that the image was covering its border. To fix it, I had to apply the border directly to the image."Another challenge I faced was getting the image to resize properly. I initially tried using a fixed height and width, but that didn't work well when the screen size changed. To fix this, I had to use percentage-based values for the height and width, which allowed the image to scale proportionally. This involved some trial and error to get the right values that looked good across different screen sizes.

Aligning the text and image was also tricky. I wanted the text to be next to the image, but I wasn't sure how to do that without the text overlapping the image. In the end, I used a combination of CSS flexbox and positioning to get the layout just right. It took some experimenting, but I'm happy with how it turned out in the end."