Skip to content
Submitted about 3 years ago

Responsive pricing grid using Grid layout

Juan Zapien•95
@1Zapien
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Single price grid component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Trying out grid-template-areas for the first time. Any feedback would be appreciated.

Community feedback

  • Fluffy Kas•7,715
    @FluffyKasPosted about 3 years ago

    Hey, it's a really great looking solution! The only issue I see is your breakpoint which seems a bit off (check it between 600 and 750px) ^^

    Marked as helpful
    2
    Juan Zapien•95
    @1ZapienPosted about 3 years ago

    Hey @FluffyKas thanks for the feedback, not quite sure what would make a better breakpoint though. I currently have it at 600px. Thanks.

    0
    Fluffy Kas•7,715
    @FluffyKasPosted about 3 years ago

    @1Zapien 800px perhaps? If the component stretches too much between 600 and 800px, you can always just give it a max-width!

    0
    Juan Zapien•95
    @1ZapienPosted about 3 years ago

    @FluffyKas Never mind I see what you mean now my layout was getting to crowded because my break point was to low. I changed it to 700px

    0

Please log in to post a comment

Log in with GitHub

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