Skip to content
Submitted over 2 years ago

Nft Card challenge using css and html

Aakash•10
@Akash-pugazh
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 have not well optimized it for mobile can anyone suggest me how it can be done other than media query like can i learn bootstrap framework

Community feedback

  • Hexer•3,660
    @EmmanuelHexerPosted over 2 years ago

    Hi @Akash-pugazh, I took some time to look at your solution and you did a great job!

    However I have some tips for improving your code:

    • Avoid using in-line styles in your html. Use css to style your page on a seperate document. What i mean is you should'nt use ie color: #fb2342 in your html but rather do it in css file.

    • wrap your card in a <main> element to fix accessibility issues.

    Hope this help and happy coding!

    Marked as helpful
    0
  • Aakash•10
    @Akash-pugazhPosted over 2 years ago

    Thankyou so much for your valuable comment thereby I take your points :)

    1
    Hexer•3,660
    @EmmanuelHexerPosted over 2 years ago

    @Akash-pugazh You're welcome man.

    0
  • Naveen Gumaste•10,480
    @NaveenGumastePosted over 2 years ago

    Hello Aakash ! Congo 👏 on completing this challenge

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

    • Warp your card content around the main tag Ex: 👇
    <body>
<main class="container">
*all you content here*
</main>
</body>

    • Always use h1 first and then h2, h3 and so on

    • use the font-weight as given in style-guide

    happy Coding😀

    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