This is a solution to the NFT preview card component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

• Overview
  • The challenge
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author

Users should be able to:

• View the optimal layout depending on their device's screen size.
• See hover states for interactive elements.

Desktop View

Mobile View


• Solution URL: GitHub Repository
• Live Site URL: GitHub Pages

• Semantic HTML5 markup
• CSS custom properties
• Flexbox

• I learned how to implement the CSS properties, especially the Flexbox.
• I also learned about hover effect i.e.

heading h4 a:hover{

    cursor: pointer;
    color: rgba(0, 255, 255, 0.685);
    
    transition: 0.2s;
}

I would like to further practice positioning and transitioning the elements, using flexbox and using gridbox.

• W3Schools - This helped me in using pseudo-classes and in CSS.
• MDN Web Docs - This resource helped me a lot in using flexbox and CSS.

• Frontend Mentor - @namangaur2
• LinkedIn - Naman Gaur
• Behance - Naman Gaur