Design comparison
Community feedback
- @its-rkraviPosted over 1 year ago
Congratulations @foufoue for completing the challenge.
Welcome to the Frontend Mentor Platform. I want to give you some feedback regarding your code. Inside the style.css file. your component is not center properly. So you need to do some changes in your CSS file.
you create a section which is inside the body.
you give some styling to the body which is given below.
body { display: flex; justify-content: center; }
just remove these two properties we don't need them.
justify-self: center margin: 6rem auto
first of all you need to give a height to this body. like 100vh. and whatever the content which is inside the body is centering horizontally. Along with this you also need to center it vertically. So for this you need to write the code which is given below.
body { height: 100vh; display: flex; justify-content: center; align-items: center; }
Few Tips:
Using Flexbox or Grid to center elements can offer several advantages, including better responsiveness, cleaner code, and improved compatibility. Additionally, it promotes the adoption of best practices in web development.
Use more modern and flexible techniques like Flexbox or Grid for layout purposes. These CSS features are designed to make web development easier, more maintainable, and responsive across various devices.
I hope you find this feedback helpful.
Keep up the excellent work, and if you have any further questions or need assistance with anything, feel free to ask.
Mail : [email protected]
Instagram : its_rkravi
Together, we can continue to build a supportive and knowledgeable community.
Best regards, Rahul Kumar Ravi
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