Single price grid component using CSS Flexbox, and CSS Grid

Community feedback

• 

  P

  Nate Northway•190

  @nnorthwayPosted almost 4 years ago

  IMO putting classes on every element can get a bit obnoxious. It's not invalid or anything, but I find it to bog me down when writing the markup. But you do you, your finished product is great.

  I think part of the sizing issue could come from where the line breaks in the text under the green heading. In the design file, the line breaks after "reviews". In your finished design, it breaks after "developers". I think putting a < br / > tag after "reviews" might help. (edit: can't put HTML in here, huh?)

  Other than that, just keeping the margins & padding consistent helps. Making sure a reset/normalize stylesheet is used is a big thing for me, personally - saves a lot of headache when trying to figure out why a thing isn't perfect.

  All of your code is clean and consistent. Your markup makes sense (and is semantic, not just a bunch of <div>s), and it's super close to the design. Nice work!

  2

  ---

  

  Jackson Jude•195

  @JacksonJ97Posted almost 4 years ago

  You're right, writing classes on every element can get obnoxious and overwhelming to look at the markup. I should focus on writing classes that make sense and as a result make writing my CSS easier. I should also keep the margin and padding sizing consistent. The reset/normalize stylesheet is a great suggestion, which I will start using from now on. Thank you for your feedback and suggestions, I greatly appreciate it! :)

  1