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

Solution for 3-column preview card using CSS Grid

@DenzDy

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 tips to improve the responsiveness of the website? Aside from using clamp(), im still not sure how to make parts of the website responsive. Should I have made a div for the buttons to resolve the position issues when resizing? Also, it seems that for the desktop version of the website, the viewport height is too big. How do I change the height to browser height instead of display height? Currently use 1080p but is there a resolution for browsers?

Community feedback

P
Patrick 14,325

@palgramming

Posted

If you put a common height on the paragraph text in the cards then that will solve your button alignment issue at some widths

0

@DenzDy

Posted

@palgramming Any tips on website responsiveness? I don't really feel confident on the responsive part of the website yet.

0
P
Patrick 14,325

@palgramming

Posted

@DenzDy in this case I think your challenge looks OK you might think about working through this free certificate if you have not done it yet https://www.freecodecamp.org/learn/responsive-web-design/

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