Design comparison
Solution retrospective
It was easy to build. Here, I tried to warm up my memory after coming from a long vacation. I know there has something to improve, like I used to write clean codes which was easier to read but here it becomes a little more of a divs than actual content. It will be very helpful if you have any suggestions to make it easy way because I have just started to code.
Community feedback
- @danielmrz-devPosted 11 months ago
Hello @Webdevsonu!
Your project looks great!
I noticed that your card isn't centered even though you did everything right. DevTools is saying that your body has a
flex-wrap: nowrap;
setting... but it does not have🤔So here's another way for you to center it, just in case:
- You can apply this to the element (works well with projects with only one centered element, like this one):
.element { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
- Also for semantic reasons, you can replace your
div.container
withmain.container
. This tag change have no visual impact but they make your HTML code more semantic and improve SEO optimization as well as the accessibility of your project.
I hope it helps!
Other than that, great job!
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