Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

3-Column Preview Card Component Using CSS Grid

Nathasha 150

@NathashaR1997

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hey Everyone, I have completed the challenge using the grid.

Check out my following article, where I have briefly explained the steps I have followed to complete this challenge.

https://uxplanet.org/challenge-005-3-column-preview-card-component-6c9b4e797f98

Thank you for checking this out, and feel free to leave your feedback and thoughts!! Any feedback and tips are welcome.

Many Thanks! Nathasha 😊

Community feedback

@omerome83

Posted

Great job on the challenge and I love how you documented your steps.

My suggestion would be to add a hover state over each of the "Learn More" buttons.

It doesn't have to be anything complicated, but something like this could work:

.first-column .button:hover { 
  border: 2px solid hsl(0, 0%, 100%, 0.75);
  color: #E28525;
}
0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord