Product Preview Card Utilizing HTML and CSS

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

I'm most proud that I stuck with this project and made it as responsive as I could without sacrificing the overall layout. There was a specific way in that I wanted this project to look, and I just stuck with it until I constructed it to my liking.

In reference to what I'd do next time, I'm not sure actually. What I made sure that I did this time, was la out the content in HTML so I didn't always have to go back and reconstruct elements. This is essentially how I wanted to go about this project, which stemmed from some things that I ran into on the LAST project.

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

Making the image responsive was the challenge for me here. I've read the MDN articles, Stack Overflow...and I just couldn't figure out why I couldn't stretch the perfume image from the mobile layout without sacrificing the content of what I had already built. I basically had to familiarize myself with percentages in combination of the 'max-width', 'min-width', and 'width' properties. It took some fidgeting with the code in order for me to get it all put together, but eventually I found the solution. I also had a lot of issues getting the footer to view correctly in the mobile layout. I had the position at 'absolute' because I didn't know how to get it to align below the card. I took a break, a quick nap, and it occurred to me that I just needed to change the 'flex-direction' on my '.canvas' class to 'column'.

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

I don't think there is anything that I needed help with, but tips and comments are always helpful. I just want to get better every day...