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 card layout using Html and Sass

@Manuel254

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


It was quite a simple challenge. Took me an hour :). I would like feedback on how my code is and some of the things I should improve on.

There is some weird behaviour going on with the cards when a button is in active state. If you know why please help me.

Community feedback

P
Matt Studdert 13,611

@mattstuddert

Posted

Nice work on this challenge, Immanuel, and congrats on submitting your first solution! 🎉

The issue with your buttons is because you're using :active state selector instead of :hover. You're also changing the width of the border, which is causing a slight jump. While we're on the topic of the buttons, I'd recommend using anchor elements instead. You could imagine if this was a real site that these would link to other pages, so anchor tags make sense here.

You could also try making it so that the call-to-actions are always pushed to the bottom. The middle one is out of alignment with the others on larger screens as the paragraph content is shorter.

Keep up the great work!

0

@Manuel254

Posted

@mattstuddert Thanks so much for the comment. Means a lot. I will rectify on the mistakes that I have made.

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