Skip to content
Submitted almost 2 years ago

Responsive Single Price Component

Brian•150
@briangesteban
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

Feel free to leave a feedback. Any feedbacks are appreciated. Thank you in advance!

Community feedback

  • Vanza Setia•27,775
    @vanzasetiaPosted almost 2 years ago

    Hello, Brian!

    I recommend making the first <h2> as <p> that has <strong> instead. It is not a sub-title of the card. Then, remove html { min-height: 100%; }. It is better to do body { min-height: 100vh } instead. It is best to treat the <body> as the main element of the web page instead of <html>.

    After that, use flexbox or grid to place the card in the center of the page. These modern techniques are more robust than absolute positioning and have less code to write.

    I hope this helps. Happy coding!

    Marked as helpful
    1
    Brian•150
    @briangestebanPosted almost 2 years ago

    Hi, @vanzasetia! Thank you for the feedback. I will take note of these and apply it to my next challenge. I really appreciate it!

    1

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