Hi,
This is my first ever html/css project. The things that I unsure are how to center a div container and how to make its size shrink or expand with the page size.
Thank you.
@TRIPLE-ADE
Posted
Nice work For you to make you content to appear at the middle of your page Body{ Display: flex; Flex-direction:column; Justify-content:center; Align-items:center; Min-height:100vh; } Or Display:grid; Place-items: center;
Marked as helpful
@sqtran01
Posted
@TRIPLE-ADE Thank you!
@hebam17
Posted
For you to center the container and solve your accessibility issues wrap your HTML code "the container" with a <main> tag and add this CSS code main{ width:100vw; //taking full screen width height:100vh; //taking full screen height overflow-y:auto; display: flex; //display the main element as flex you can search for flexbox it's the most used method to center align elements justify-content:center; align-items:center }
and for it to shrink you can use something called a media query hope that helps
Marked as helpful
@sqtran01
Posted
@hebam17 Thank you very much for your feedback! I'll try it out.
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
