Skip to content

ldelgarias/project1repo

Repository files navigation

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

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

Screenshot of final design with HTML and CSS code

Links

My process

I used some code from a prior project assignment and from there I tested it on my local computer until I got the look that I needed. I googled a lot to find pieces that were not part of the prior project and integrated those on this project. I also had to learn a lot about github - building a repository, cloning in Atom, and using GitHub Desktop.

Built with

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

What I learned

I learned a lot through this process in terms of finding the elements I needed in order to get the layout as close as it was required and testing them as I went along.

Useful resources

Author

Acknowledgments

Thanks to Frontendmasters (https://frontendmasters.com/) I was able to use some of the code that I learned from them in a prior learning project.

About

Repo for the 3-column-preview-card-component-main project

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published