3-column preview card component solution using Html and CSS

Community feedback

• 

  vcodey•270

  @v-codeyPosted over 2 years ago

  hey @maestroeffect

  I reviewed your code you've done a good job just needed some tweak and use different technique. check your github repo.

  • you need to learn about DRY principle.
  • use root pseudo selector
  • using position with hard coded value of position left: 20rem ,top: 15rem to make card side by side is not very smart choice according to me.

  those were some of my observations, keep learning happy coding.

  Marked as helpful

  0

  ---

  

  Precious Omoh•30

  @maestroeffectPosted over 2 years ago

  @v-codey thank you very much, I appreciate it

  0
• 

  Travolgi 🍕•31,400

  @denieldenPosted over 2 years ago

  Hi Precious,good job! I took some time to look at your code and have some ideas for improving it:

  • with font-family:" Big Shoulders Display ", cursive the browser will use the Comics Sans font when it doesn't find the first font indicated (you can seen during loading)... for the designer it's a really awful font! I would rather replace it with a font-family:" Big Shoulders Display ", sans-serif much more similar to the primary font.
  • add main tag and wrap the card for improve the Accessibility
  • remove all margin from body
  • try to use flexbox to the body for center the card. Read here -> best flex guide
  • after, add min-height: 100vh to body because Flexbox aligns child items to the size of the parent container and remove height: 37.5rem

  Overall you did well 😉

  Hope this help and happy coding!

  Marked as helpful

  0