Responsive Single Price Component

Community feedback

• 

  

  Matt Studdert•13,611

  @mattstuddert

  Posted over 5 years ago

  Great work on this challenge, Sonia! Rafael has already given some great advice.

  With regards to CSS units, I typically use rem for properties like font-size, padding and margin. This allows you to simply re-declare the font-size on the html element and the sizes will change proportionally.

  I very rarely use vw, as it only looks at the viewport. This means you can get some unexpected sizing issues where child elements overflow their parent on the x-axis. Instead, I'll typically use %. Or if I'm using Flexbox, flex-grow and with Grid I'll commonly use fr units.

  I hope that helps. Let me know if you have any questions!

  20
• 

  Rafael Maia Chieregatto•320

  @rafaelmaiach

  Posted over 5 years ago

  Hey, congrats on your solution!

  As some feedback I can give:

  • Prefer IDs/classes to style your elements instead of inline styling. Inline styling can be very hard to read when you need to use a lot of styling.

  • You could check some different resolutions when resizing the browser to check some layout broking gaps.

  10
• 

  screaminghaiku•20

  @screaminghaiku

  Posted over 5 years ago

  Thanks so much for the feedback. We just learned about implementing bootstrap and refactoring work. Looking forward to implementing this advice with it.

  00