This is a solution to the Product preview card component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Using only HTML and CSS to replicate a Product Preview Card with responsive design.
Users should be able to:
- View the optimal layout depending on their device's screen size
- See hover and focus states for interactive elements
- Solution URL: Add solution URL here
- Live Site URL: Add live site URL here
Along with Visual Code Camp, I used Photoshop to get some pixel measurements from the original design.
- Semantic HTML5 markup
- CSS
- Flexbox
- CSS Grid
I learned how to make breakpoints more properly.
I need to practice the positions more.
- Mr Coder - This helped me how to start the project. I really liked this video.
- Frontend Mentor - @NathalyCavalcante
- Twitter - @Nathaly_Ylahtan