NFT preview card component

Community feedback

• 

  Alamin•2,000

  @CodeWithAlaminPosted almost 2 years ago

  Hi Ositaro👋 Great job on completing this challenge! 🥳

  I would like to share a few suggestions on this solution if you don't mind.

  HTML

  • Use semantic elements where appropriate. For example, you could use a header element to wrap the img element in the .top class and a footer element to wrap the img and p elements in the .down class. This helps make the structure of the page more meaningful to screen readers and other assistive technologies. Learn more

  • Use proper alt text for images. The alt attribute of an img element should describe the purpose of the image. For example, the alt attribute for the img element in the .top class could be "view NFT" and the alt attribute for the img element in the .down class could be "avatar image". This helps make the page more accessible to users with visual impairments. Learn more

  CSS

  • Use more specific selectors to increase the specificity of your styles. For example, you could use a class name as a selector instead of just an element name. This can help prevent your styles from being overridden by other styles on the page. Learn more

  • Consider using a CSS reset to ensure that all elements have a consistent starting point. This can help avoid cross-browser inconsistencies and make it easier to style your page. Learn more

  • Use more descriptive class names to make your styles more readable and maintainable. For example, instead of using a class name like .up, you could use a name like .image-container that more accurately describes the purpose of the class. Learn more

  Overall, this is a very well done solution to the challenge. Great job!

  I hope this feedback was helpful. 😊 Keep up the good work!👍

  Marked as helpful

  0