@elaineleung
Posted
Hi Meobot, well done completing your first challenge, and welcome to Frontend Mentor! Yes, there definitely is a better practice, and it's what Nikola described above. Since you already are using flexbox in your body, you can just add align-items:center
and min-height: 100vh
, and then remove the margin you put in. You'd always need a height when centering because if there's no extra space around the container, the browser would not be able to center the element because centering requires equal spacing around the element. Also, this code works if you only got one child element to center; if you have more children elements (like a footer for example), you'd need to change your flex properties a bit.
Once again, great job and happy coding!
Marked as helpful
@Meobot
Posted
@elaineleung Thanks a ton, that helps it make sense.