Design comparison
SolutionDesign
Solution retrospective
how we can center the components in div without flex box.
Community feedback
- @aykinsancakliPosted 10 months ago
Hello @Mussa-Chitemo
📌 You can try this one ⬇️
- To center components in a div without flexbox, you can use
transform: translate(-50%, -50%)
for both horizontal and vertical centering.
.container { width: 100%; height: 300px; position: relative; /* Establish positioning context */ } .centered-content { position: absolute; /* Position relative to the container */ top: 50%; /* Move 50% down from the top */ left: 50%; /* Move 50% from the left */ transform: translate(-50%, -50%); /* Center the element */ }
Hope this helps.
Cheers,
Aykın
0 - To center components in a div without flexbox, you can use
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