Skip to content
Submitted over 3 years ago

Single Price Challenge with HTML and CSS Flexbox

Sebastian Arevalo•130
@arevalosebastian
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

Having issues with grid, so I used flexbox, any tips about my CSS? Thank you for you attention.

Community feedback

  • Vanza Setia•27,775
    @vanzasetiaPosted over 3 years ago

    👋Hi Sebastian! My name is Vanza!

    🎉Congratulations on finishing this challenge! I have some tips that may help improve your CSS.

    1. It seems like you keep repeating @media screen and (min-width: 700px). My recommendation is that making them into one single media query, that way your CSS will be much cleaner.
    2. For the box3__text, I recommend to use ul and each text wrap in li tag, that way you can easily control the spacing for each li.
    3. Last but not least, you can use CSS custom property for your colors, that way you don't have to keep typing or copy pasting the color.

    That's it! Hopefully those tips will help you to improve your CSS!

    And as always keep coding and happy coding!

    Marked as helpful
    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