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

HTML, CSS, &Sass

Henry Zhengβ€’ 420

@LonelyBuddy

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


Any feedback would be appreciated😊

Community feedback

P
Kenβ€’ 4,915

@kens-visuals

Posted

Hey @LonelyBuddy πŸ‘‹πŸ»

I have some suggestion for the project.

  • First, instead of separately giving border-radius to each card, you can do the following:
main {
    border-radius: 0.5rem;
    overflow: hidden;
}
  • For the car icons, add aria-hidden="true”, because they're for decoration. You can read more about aria-hidden here.
  • Also, I suggest adding transition: all 0.2s; to the button and the links, this will make :hover smoother.

I hope this was helpful πŸ‘¨πŸ»β€πŸ’» overall, you did a great job, well done. Cheers πŸ‘Ύ

Marked as helpful

1

Henry Zhengβ€’ 420

@LonelyBuddy

Posted

@kens-visuals Thanks for the feedback! The transition on buttons really makes the difference 😁.

0
P
Kenβ€’ 4,915

@kens-visuals

Posted

@LonelyBuddy no problem πŸ˜‡

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