3-column preview card component solution with grid-box and flex-box

Community feedback

• 

  romila•3,570

  @romila2003Posted over 2 years ago

  Hi @akmata201,

  Congratulations 🎉 on completing this challenge, it was a great attempt but there are some issues I noticed:

  1. When adjusting the screen size from desktop to mobile, the card did not respond very well. The design looks good in the desktop version however as you decrease the screen size to mobile and tablet, the card becomes very squashed and awkward which would affect users using those particular screen sizes. A way to adjust this, is to follow the mobile-first approach as it would be easier to adjust the elements and texts within the card as you increase the screen size. If you unsure about this concept, then you should research more about this concept in depth through various sources.
  2. Also, in mobile screen, the top part of the card is cut off which may be due to the height being set at 100vh.
  3. The width for the buttons at the bottom of the card, seem quite long so you should reduce the padding for them.

  Overall, it was a good attempt and wish you the best for your future projects so keep coding 👍.

  Marked as helpful

  0