Skip to content
Submitted about 2 years ago

Flexbox NFT Component

averagedeveloper•40
@mpgithubcode
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...NFT preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I'm getting more and more comfortable with the flexbox and positioning with them!

I will definitely redo this one. I am on the free tier currently but I plan on upgrading. Since I don't have access I get a little frustrated when trying to recreate the sizing and formatting from the picture.

For example, I could not see or find the color that was bordering around the avatar picture, and the default text included in the design docs where too small

I still need to work on:

  • media queries
  • hover states

Community feedback

  • Abdallah Ahmed•60
    @AbdallahGOPosted about 2 years ago

    media queries and hover they like a condition . for example when you write :

    ' div:hover => it means when you hovering div box something happens '

    BUT

    div:hover div2 => it means when you hovering div box something happens to div2 and it must be div2 inside div to work '

    and about media queries, it's not more important than hover but you will a lot in make fonts or customize your website in different screen sizes

    I hope that was helpful ✌️

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord