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 single price grid component [Flexbox, Grid]

@felipe-miranda-marreiros

Desktop design screenshot for the Single price grid component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View Challenge

Design Comparison

SolutionDesign

Report

4

Accessibility Issues

0

HTML Issues

View Report

Felipe Miranda Marreiros’s questions for the community

Any tips would be nice :)

Community Feedback

darryncodes 6,290

@darryncodes

Posted

Hi Felipe,

Really great solution, very responsive - well done!

Minor feedback but could look nice if you centred your design in the viewport responsively by adding:

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    min-height: 100vh;

Marked as helpful

1


P

@Remus432

Posted

Hey @felipe-miranda-marreiros

Great job on completing this challenge! Looks really similar to the original design, just a bit bigger.

Your CSS code is really clean. I think you're more than ready to implement these modern CSS concepts

Check them out in this video https://www.youtube.com/watch?v=VsNAuGkCpQU&ab_channel=KevinPowell

Keep up the great work!

Marked as helpful

1


@felipe-miranda-marreiros

Posted

@Remus432 thanks for the video recommendation. I'll definitely watch and apply it in my future challenges.

0

Please focus on giving high-quality, helpful feedback and answering any questions felipe-miranda-marreiros might have. Here are some key points to consider:

  • Does the solution include semantic HTML?
  • Is it accessible, and what improvements could be made?
  • Does the layout look good on a range of screen sizes?
  • Is the code well-structured, readable, and reusable?

You can read our community guidelines if you're unsure what to post.

Slack logo

Join our Slack community

Join over 100,000 people taking the challenges, talking about their code, helping each other, and chatting about all things front-end!