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

@PedroHigueraG

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


All suggestions are welcome

Community feedback

@mmenghnani

Posted

Hi Pedro, this looks really great. Just a few nitpicks I noted,

  1. The height changes when you hover over the buttons. I don't think that is intended behavior. You can just use the suggestion that patrick shared above!

  2. Is there any specific reason why we can't directly use button tag in the stylesheet instead of creating a new button class

  3. Also, small typo - all three images tags have the same alt text :)

Great work, :clapping

Marked as helpful

1

@PedroHigueraG

Posted

@mmenghnani Thanks for your comment!, I'll correct the code and improved it. :3

0
P
Patrick‱ 14,325

@palgramming

Posted

move this order: 0.1rem solid var(--very-light-gray); from your button hover to just the button this way when you hover the button your card does not change height

Marked as helpful

1

@PedroHigueraG

Posted

@palgramming Thank you for the solution to the hover problem!, I'll edit the code of my CSS file.

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