3-column-preview-card-component

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted about 2 years ago

  Hi, Shalini! 👋

  Congratulations on finishing this challenge! 🎉

  Some suggestions from me.

  • I recommend removing the empty h1. In this case, it's okay to not have h1 since it is not a full website.
  • For images that are used only as decorations (they do not give users any information and serve only an aesthetic purpose), the alt tag should still exist but should be left empty: alt="". This will tell the screen reader to simply skip over the image.
  • Use CSS to uppercase the text. The uppercased word in the HTML might be spelled by the screen reader (spelled letter by letter).
  • Always specify the type of the button. In this case, set the type of them as type="button". It will prevent the button from behaving unexpectedly.
  • Never use 100vw on the body as it doesn't account for scrollbars when present. It may only ever introduce potential overflow/scroll bugs.
  • Use single class selectors for styling whenever possible instead of id. id has high specificity which can lead to a lot of issues on the larger project. It's best to keep the CSS specificity as low and flat as possible.

  For your information, it is possible to make the site responsive without media queries. You can take a look at my solution.

  I hope this helps! Happy coding!

  Marked as helpful

  1

  ---

  

  Shalini Anand•180

  @liniii31Posted about 2 years ago

  @vanzasetia Thank you :)

  0

  

  Vanza Setia•27,775

  @vanzasetiaPosted about 2 years ago

  @liniii31 You are welcome! 👍

  0