Product preview card component main

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

I am most proud of the clean and responsive layout achieved using Flexbox and semantic HTML5. The code is well-organized, and the use of CSS custom properties ensures consistency and easy future updates.

Next time, I would focus more on enhancing accessibility by incorporating ARIA attributes and improving performance through optimization techniques like lazy loading for images.

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

I encountered challenges with the new media query syntax @media (width >= 470px), as it wasn’t supported by browsers like Firefox. To resolve this, I reverted to the more widely supported syntax, @media (min-width: 470px), ensuring compatibility across all browsers. This experience reinforced the importance of testing for cross-browser compatibility.