Order Summary Component

Community feedback

• 

  Fer•3,970

  @fernandolapazPosted over 1 year ago

  Hi,

  • Regarding font-size units, I don't really know of any resources good enough to recommend, but here's a video from Coder Coder where she explains it pretty well:

  Coder Coder - px vs rem: what to use for font-size in your CSS 🔎

  I take the opportunity to leave you a couple of posts about the 62.5% trick:

  Josh Comeau - The 62.5% Trick 🔎

  FedMentor.dev - Should I change the default HTML font-size to 62.5%? 🔎

  • And as for Grid and Flexbox, maybe Flexbox is enough, you'll realize. But I am a fan of grid : ), and just in case I leave you with a series of videos by Rachel Andrew that is very good:

  Rachel Andrew - Grid by Example 🔎

  Regards,

  Marked as helpful

  0

  ---

  

  Whitney Dallas•80

  @Wdallas12Posted over 1 year ago

  Thank you so much! I appreciate your help :) @fernandolapaz

  1
• 

  Fer•3,970

  @fernandolapazPosted over 1 year ago

  Hi 👋, perhaps some of this may interest you:

  HTML / ACCESSIBILITY:

  • The main content of every page (the card in this case) should be wrapped with the <main> tag.

  • The icon is a decorative image and therefore needs an empty alt attribute to be ignored by a screen reader.

  CSS:

  • The trick of setting the font size: 62.5%; is no longer commonly recommended because it can cause issues with accessibility and readability. Also, it’s good to get used to thinking directly in relative units like rem or em since they are the most suitable for most cases.

  • The page content could be centered using Grid or Flexbox. For example as follows:

  body {
  min-height: 100vh;
  display: grid;
  place-content: center;
  }
  

  Please let me know if you want more info on any of these topics or disagree with something.

  I hope it’s useful : )

  Regards,

  Marked as helpful

  0

  ---

  

  Whitney Dallas•80

  @Wdallas12Posted over 1 year ago

  Thanks for the tip about the icon. I wasn't sure how to go about that with accessibility. As far as rem and em goes for font size, do you have any resources that you think do a good job explaining the best usage of them?

  Also, I haven't really spent any time learning Grid, only Flexbox. Do you recommend I spend some time familiarizing myself with that as well?@fernandolapaz

  0