Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

A NFT card with flexbox

Franciscoβ€’ 30

@Headfran

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


This is my first solution submitting. I'm learning more about the world of web development. Any advice and suggestion IΒ΄ll take with pleasure.

Community feedback

Account Deleted

Hello there! πŸ‘‹

Congratulations on finishing your challenge! πŸŽ‰

I have some feedback on this solution:

  • Always Use Semantic HTML instead of div like <main> <header> <footer> , etc for more info
1
Dev Rathoreβ€’ 2,600

@GitHub-dev12345

Posted

If You want reduce accessibility, to change this code:

<div class="attribution"> to <footer> ( Used footer Tag for design ). πŸ‘ŒπŸš€πŸ‘
0
Dev Rathoreβ€’ 2,600

@GitHub-dev12345

Posted

Congratulation πŸš€πŸ˜ complete your challenge. Used this code want your card in center position :

in body tag Used this CSS Code: body{ display : flex; justify-content: center; align-item: center; }

in Card Design CSS Code used this property: align-self: center;

0
Naveen Gumasteβ€’ 10,460

@NaveenGumaste

Posted

Hello Francisco ! Congo πŸ‘ on completing this challenge

Let's look at some of your issues, shall we:

  • Wrong font-weight for the "eth" so change that.

  • Consider using h2-h6 elements to add identifying headings to all sections.

happy CodingπŸ˜€

0

Please log in to post a comment

Log in with GitHub
Discord logo

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