nft-preview-card-component using CSS PseudoElements and Positioning

Community feedback

• 

  darryncodes•6,390

  @darryncodesPosted almost 3 years ago

  Hi Srijan

  Great solution - nice work!

  I'd encourage you do clear your accessibility report. If you add alt-txt, a h1 and use semantic html you'll clear it. Semantics and heading structure is really important. For example <div class="card"> should be <main class="card">.

  I'd also think about the interactive elements having cursor: pointer and consider <div class="card-image-container"> being an anchor tag for accessibility as it's interactive.

  I hope that helps & keep up the momentum!

  Marked as helpful

  0
• 

  Web Wizard•5,690

  @rsrclabPosted almost 3 years ago

  Hi, SRIJAN SAINI ~

  Congratulate on your solution to the challenge on FM platform. I have studied your work carefully and learned a lot from it. Especially I like BEM structure on the solution.

  Here are some of the tips I like to provide.

  1. Please add transition effect on heading and creator name.
  2. Image tags must have alt attribute as a standard.
  3. Card goes over screen on smaller devices, and I think max-width will solve the issue.

  https://www.frontendmentor.io/solutions/my-first-solution-on-chanllenge-V-4IzAivH

  Here is my solution to this challenge, and if it can help you even a bit, it would be happy to me.

  Cheers ~

  Marked as helpful

  0