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
Request path contains unescaped characters

Submitted

3-Column preview card component with plane CSS and HTML

@surphury

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


Please feel free to amend anything in the code.

Community feedback

T
ApplePieGiraffe 30,545

@ApplePieGiraffe

Posted

Hey there, Jose Berrios! 👋

Good job on this challenge! 👏 Your solution looks great and is responsive! 👍

I suggest,

  • Adding a little space around the top/bottom of the card component in the mobile layout so that it isn't right up against the edges of the screen.
  • Adding cursor: pointer to the buttons in the card (or even making them links instead, since they seem like they might take the user somewhere when clicked).
  • Using a heading tag (such as <h2> or <h3>) for the titles of the sections of the card (since that is more fitting for headings, and the <strong> doesn't need to be used for that). 😉

I hope those few tips help. 🙂

Keep coding (and happy coding, too)! 😁

Marked as helpful

1

@surphury

Posted

@ApplePieGiraffe Thank you! I'll do it, I really appreciate your feedback

1
Aman Patil 885

@Amanpatil-Dev

Posted

Nice work Looks good 👌👍

Marked as helpful

1

@surphury

Posted

@Amanpatil-Dev Thanks, I really appreciate your words.

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