DEV Community

Cover image for Challenge 7 - 3-column preview card component - Frontend Mentor
Abhishek Baliyan
Abhishek Baliyan

Posted on

Challenge 7 - 3-column preview card component - Frontend Mentor

Challenge 7, Frontend Mentor - 3-column preview card component solution

This is a solution to the 3-column preview card component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

Overview

3-column preview card component challenge by Frontend Mentor, Coded by Abhishek Baliyan.

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

Desktop View
Mobile View

Links

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • Flexbox
  • Mobile-first workflow

What I learned

While i was trying to match the design and code, I learned width adjusting.

Continued development

I want to learn more about the min width for responsiveness.

Author

Top comments (0)