NFT Component

Please log in to post a comment
Log in with GitHubCommunity feedback
- @correlucas
👾Hello Samantha, congratulations for your new solution!
Your solution already looks great, the only thing you need to do now is to give it the proper vertical alignment:
Add
min-height: 100vh
to make the body have 100% of the viewport height and make the container align to this size using these flex propertiesdisplay: flex; align-items: center; justify-content: center; flex-direction: column;
body { min-height: 100vh; margin: 0; font-family: var(--bs-body-font-family); font-size: var(--bs-body-font-size); font-weight: var(--bs-body-font-weight); line-height: var(--bs-body-line-height); color: var(--bs-body-color); text-align: var(--bs-body-text-align); background-color: var(--bs-body-bg); -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; display: flex; align-items: center; justify-content: center; flex-direction: column; }
👋 I hope this helps you and happy coding!
Marked as helpful - @iamenochlee
hey there, this is nice, I noticed some few stuff, the timer and clock are not well aligned, just put them both in a container and apply a
display: flex; justify-content: space-between; align-items-center
, You seem to be using some weird property for margins which results in your container not properly centered, try to fix this, keep coding.Marked as helpful
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