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

Responsive 3 column challenge

@MomenHakim

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?

Community feedback

@GrzywN

Posted

Good job on the challenge. I have some suggestions for your project:

  • In this project unfortunately you have to setup border-radius manually for each wrap. What you have done causes your border-radius to not match the design file for mobile. You can use styling like border-top-right-radius: 10px; for example to match the design.
  • Something happened with third button and it's not in the same line as other two. I would recommend you to learn Flexbox or CSS Grid to create advanced layouts more quickly and without any problems. To do so I recommend Flexbox Froggy or Grid Garden. It's really simple way to start learning and using Flexbox or CSS Grid or even both of them depending on a layout. Keep up the great work and have a nice day!

Marked as helpful

1
Hexer 3,660

@Phalcin

Posted

Great work, but try to learn some css and grid before attempting projects like these. Check out mine also

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