Alberto Ledesma• 370
@ledesmx
Posted
Hi @mcstarley1215 👋
Great job on your solution!
You almost have it centered. The body takes the height of the content inside itself like its own height. Meaning when you try to center its content vertically it doesn't work unless you explicitly set the body's height. Fortunately, it's pretty straightforward to do it.
You only need to add the following code for the body tag:
body {
min-height: 100vh;
}
It sets the minimum height of the body tag for the 100% of the viewport's height. Now your content will be centered vertically.
Regarding to you question I suggest checking out this game about Flexbox: https://geddski.teachable.com/p/flexbox-zombies
And practice a lot what you learn with projects like this.
I hope this helps a little.
Marked as helpful
1
