Challenge 2 || NFT card

Hi Sachin you can use width: 400px instead of 30% because he percentage value is change by body width change example if i have body width value 1000px and i use width 30% for main element now if body width change from 1000px to 500px the main element will change from 300 to 150px and sometimes that not be perfect to element on your website. you can use specific width value like 250px and this value will never change by body width value change

Hi Sachin, I took some time to look at your solution and you did a great job!

Also I have some tips for improving your code:

• add descriptive text in the alt attribute of the image
• You can add the effect :hover creating a div that appears on hover. I used tailwind but you can still see and understand which css properties you can use to do the same. Look here -> my solution
• to make it look as close to the design as possible set width:20rem to container class
• remove all margin from .container class because with flex they are superfluous
• add min-height: 100vh to body because Flexbox aligns child items to the size of the parent container

Overall you did well 😉

Hope this help and happy coding!

Hi sachin, 1, you can use Flexbox to center the card. 2, you can create a color overlay by placing the image in separate div with display none and when hover make display to block. hope its helps you:)