Responsive NFT Preview Card Component Main using HTML and CSS

Community feedback

• 

  バレンタイン 😈•64,170

  @VCaramesPosted almost 2 years ago

  Hey there! 👋 Here are some suggestions to help improve your code:

  • The Background Image Property is only to be used on decorative images. NOT images that add value and serve a purpose. For this challenge you want to use the Image Element 🖼.

  • The “Icons” serve no other purpose than to be decorative; They add no value. Their alt tag should left blank and have an aria-hidden=“true” to hides it from assistive technology.

  More Info:📚

  https://www.w3.org/WAI/tutorials/images/

  • Wrap the "NFT image", "Equilibrium #3429" and "Jules Wyvern" in an anchor tags. The anchor tag will allow users to click on content and have them directed to another part of your site.

  More Info:📚

  MDN The Anchor element

  If you have any questions or need further clarification, feel free to reach out to me.

  Happy Coding!🎄🎁

  0
• 

  👾 Ekaterine Mitagvaria 👾•7,600

  @catherineisonlinePosted almost 2 years ago

  Hey, looks nice! I would also add a bit of smoother transitions for active states

  0

  ---

  

  Irfan Hafizh•150

  @irfanhfzhPosted almost 2 years ago

  @catherineisonline Thank You... use the transition on the image div not on the hover like this : transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;

  i hope this help you

  0