Design comparison
Solution retrospective
My second Challange !
Community feedback
- @abdulhasibnPosted about 2 years ago
hello. Congrats on completing your second challenge. I would like to give some suggestions for your project. Try to create a separate file for CSS and link your file in your HTML file, instead adding a giant script tag and also adding some inline CSS. As you can see, your component is not centred. To achieve that you can use
display: flex; justify-content : centre; align-items: centre;
Also change the
flex-direction: column
of the main element .Marked as helpful0 - @Illyaas4ShowPosted about 2 years ago
Welcome to the community @Lolex3366
Just need to fix a few things:
- You should use the colour given in the starter file for the background so it looks more like the design.
- You should also reduce the padding and add
text-align: center;
to the card element.
Hope this helps and Happy coding!
Marked as helpful0 - @imadvvPosted about 2 years ago
Greeting Lukas!! Congratulations on completing Your challenge!, 👏👏👏 well done.
You're almost done, just to fix that alignment add following code to the body,
body { min-height: 100vh; flex-direction: column; align-items: center; gap: 1rem; }
and that well center the card on the middle of the page,
but over all, Happy Codding, and Have a Good Day/Night
Marked as helpful0
Please log in to post a comment
Log in with GitHubJoin 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