Design comparison
Community feedback
- @Aadv1kPosted over 2 years ago
Hey! Here are some fixes I would suggest you apply on your project.
-
Media query on mobile; You should add a media query for smaller screen sizes, maybe you can change the width or the spacing of the elements in the container element.
-
Centering; To perfectly center your container over the body you can use positon absolute, like so -
.container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) }
-
Background; Css backgrounds are super powerful! You can set
background-repeat
tono-repeat
-
Semantic html; Semtantic html makes your code easier to read for both you, and someone looking at your code. semantic html is basically.
<article> <h2> Title </h2> <p> Blah blah </p> </article>
is better and more redable than just putting everything inside a div. For more info You can check this out or you can check some of my projects out to see it in practice.
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