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

Three Column Card Component

abhijeet 30

@imabhijeet

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 there, Hope you are doing great. Please review my code and provide some feedbacks or suggestion. It will be really helpful for me. Also, my buttons are not aligned for some screen size, how can I fix this.

Community feedback

Daniel 🛸 44,230

@danielmrz-dev

Posted

Hello @imabhijeet!

Your project looks great!

I have a few tips for you to improve it:

  • The card has curvy edges, so you can add border-radius to get that result;
  • You can check the style-guide file to check the recommended font-family to the project. By the way, the font you used was a good one for this project.
  • The button Learn more is a clickable element, so it's nice to add cursor: pointer to it.
  • Lastly, you can replace your div.container with main.container. This won't change anything visually, but it makes your HTML code more semantic and improves SEO optimization as well as the accessibility of your project.

I hope it helps!

Other than those little things, you did an excelent job!

Marked as helpful

1

abhijeet 30

@imabhijeet

Posted

Thankyou @danielmrz-dev for your valuable time. Some of the changes were intentional. Although I really appreciate that you pointed out the lack of SEO optimization of my project, I have implemented all the necessary changes that you have mentioned.

1
Daniel 🛸 44,230

@danielmrz-dev

Posted

I'm glad my feedback was helpful 😊 @imabhijeet

Marked as helpful

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