3-column-preview-card

Community feedback

• 

  hardy•3,660

  @hardy333Posted about 3 years ago

  Hey, nice solution, good job.

  Few corrections you might do for improving design:

  • try to use less space between card icon/image, text and button.
  • Add hover effects on buttons and also cursor:pointer;.
  • remove border-radiuses on left end right cards on right and left corners respectively.
  • Try to center cards on screen - vertically

  Good Luck.

  Marked as helpful

  3
• 

  P

  Ken•4,915

  @kens-visualsPosted about 3 years ago

  Hey @mahnoork18 👋🏻

  • In your markup, <div class="attribution">...</div> should be <footer class="attribution">...</footer>. These will fix the accessibility issues. Don't forget to generate a new repot once you fix the issues.
  • For this image <img class="icon" src="images/icon-music.svg" />, I'd put aria-hidden="true", since in this case the icons are for decorative purposes. Mainly, you should use an alt tag when the image should have some sort of description and is not used for decoration, such as, these icons.
  • Also, you may need to change margin-left on button to 40px, so it aligns with the text.

  I hope this was helpful, good job on the project. Cheers 👾

  Marked as helpful

  1

  ---

  

  Mahnoor Khan•455

  @mahnoork18Posted about 3 years ago

  @kens-visuals thanks for the feedback really helpful :)

  0