Kelvin• 915
@Kl3va
Posted
display: flex Justify content: center //aligns items along its main axis(horizontally) Align items: center. // aligns items along its cross axis (vertically). By default display set to flex keeps items in a row form.
0
Design comparison
Solution retrospective
i still don´t know what is the right way to center a div horizontally and vertically... if anyone can help with that it would be very appreciated.
Community feedback
Mohammad Ebrahimi• 250
@moheb2000
Posted
Good work 🌸🌸🌸
If you want to center a component with flexbox you can use this:
.your_div {
display: flex;
justify-content: center;
align-items: center;
}
and the parent element for your div must have height: 100%;
Some other suggestions for achieving a better work:
- Don't use h3 if you don't have h1 and h2. Use h1 instead and change its styles with css
- Use margin and max-width instead of using width and height and also use rem unit instead of using pixels
I hope my advice help you. Keep going! 🌸🌸🌸
0
Please log in to post a comment
Log in with GitHub
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