Skip to content
Submitted about 5 years ago

Single Price Grid with HTML and CSS (responsive)

Cory R•100
@CoryRunn
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

I used vw for my font-size, inside the "Monthly Subscription" section, in order to get the lines of text to stay on one line each. Is there another way to make the text responsive?

Community feedback

  • Mike Hayden-Moore•1,005
    @mickygingerPosted about 5 years ago

    Hey Cory R,

    This looks great! Personally I'm not a big fan of having text be so fluid, and tend to prefer the more traditional approach of setting the size of the font per device or breakpoint.

    However there are other approaches. CSS-Tricks has a great article about using calc to achieve similar results: https://css-tricks.com/snippets/css/fluid-typography/

    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