social-links-profile-mainhttps://medium.com/frontend-mentor/a-complete
Design comparison
Community feedback
- @fachridpPosted 4 months ago
Did you have any difficulties in making this challenge?
0@reemoon-ctrlPosted 4 months ago@fachridp yes in position every thing in center&make it responsive
0@fachridpPosted 3 months ago@reemoon-ctrl if you want to center an element, you can give
display: flex
,justify-content:center
for the horizontal axis (left to right),align-items: center
for the vertical axis (up to bottom) andmin-height: 100vh
to the wrapping element. That way all the elements inside will be centered.By default
display: flex
will make the element inside that div into row direction.But if you give a
flex-direction: column
property the direction of Y axis and X axis will be change/swap also. So it will be,align-items: center
for the horizontal axis (left to right) andjustify-content:center
will be for the vertical axis (up to bottom).Marked as helpful0@fachridpPosted 3 months ago@reemoon-ctrl for make it responsive you can use
@mediaquery
,display:grid
or even withdisplay:flex
also.You can try that if you doing next challenge from this website or other source.
Marked as helpful0@fachridpPosted 3 months ago@reemoon-ctrl Your're welcome. Let me know if you have any questions in the future.
0
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