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 Columns Preview Card Component

#sass/scss

@LucasTamaya

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


Hello, I would like a global opinion on my realization. Thank you in advance for your feedback!

Community feedback

P

@Miculino

Posted

Hey @LucasTamaya!

Good job on completing the challenge! It looks pretty much the same as the original design and your responsive design works as expected. Well done!

Consider adding a hover effect on the buttons as shown in the original design files and challenge requirements.

The code for your CSS grid is a bit messy. You're using multiple approaches for this layout. You should just pick one from those. For example, you can have the 3 horizontal columns and 3 vertically stacked columns by using grid-template-columns: repeat(3, 1fr) and grid-template-columns: repeat(1, 1fr). This will get the job done ;)

Hope these suggestions will be useful. Keep up the great work!

Marked as helpful

0

@LucasTamaya

Posted

@Remus432, thank's for your answer ! I will try to modify my code to see the result.

1

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