Frontend Mentor - 3-column preview card component solution
This is a solution to the 3-column preview card component challenge on Frontend Mentor.
Table of contents
Overview
The challenge
Users should be able to:
- View the optimal layout depending on their device's screen size
- See hover states for interactive elements
Screenshot
Links
- Solution URL: Add solution URL here
- Live Site URL: Add live site URL here
My process
Built with
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- Mobile-first workflow
What I learned
Use the mobile first design to avoid using many unnecessary media queries Used typography first in my css to make things much simplier Used min-width media query for my tablet and desktop screens used rems for a more responsive page
Author
- Frontend Mentor - @apah-dev
- Twitter - @benson_apah