Submitted over 1 year ago

NFT preview card component

Vicky Verma•180

@code-nick

Preview site View code

This is a solution for...NFT preview card component

HTML
CSS

1newbie

Design comparison

SolutionDesign

Community feedback

Vikash Maurya•310

@VikashMaurya10Posted over 1 year ago

@code-nick, you did good job🎊. I want to draw your attention to some point:

Add transition property to make more smooth loading some other css.
Do't fix width create design, if you want to fix, use max-width or min-width.i.e

card {
    background-color: hsl(217, 54%, 11%);
    box-shadow: 0px 0px 8px 10px rgba(0, 0, 0, 0.2);
    max-width: 350px;
    border-radius: 1rem;
}

To make more accessible website follow this scenario:

<html>
<head></head>
<body>
    <header></header>
    <main></main>
    <footer></footer>
</body>
</html>

I hope you find helpful. To get more help please checkout my solution click here 🌐

Marked as helpful

Vishal Maurya•500
@VishalMauryastpPosted over 1 year ago
Hello ,You are doing well but use width:fit-content property in <h1> tag this property helps to apply hover effect ,when your cursor on text .

.title{ width:fit-content; }

and other things are ok.

I hope ,it's helpful for you😐.
Marked as helpful
1

Please log in to post a comment

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