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.
Users should be able to:
- View the optimal layout depending on their device's screen size
- See hover and focus states for interactive elements
Here is my final work after working on this challenge.
- Solution URL: Solution URL
- Live Site URL: Live site URL
-Always begin by writing out the HTML code to define the structure of my website. I then style up with some CSS to make the website look more appealing to the user. Then I make the website responsive.
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
This was a great opportunity to practice CSS grids and also responsive web design. I got to understand the various responsive web design principles and also it's best practices.
I wish to continue improving on my responsive web design skills as it posed a good challenge and I was up for it.
- Website - Add your name here
- Frontend Mentor - @Kmichael017
- Twitter - @Kmichael_17
Taking this opportunity to thank the Frontend Mentor team for creating this wonderful platform where I can take my coding skills to the next level.