@NPM0486
Posted
👋Hi, you did a great job with this challenge!
I have some hints that you might find useful.👀
- I see that you didn't add the font that was available in the information added to the challenge. To add the font you need to:
- open the link provided in the documentation
- select the appropriate thicknesses that you are interested in/are given in the documentation.
- a panel will appear on the right side along with two code snippets.
- you paste the <link> codes in the head in html.
- you use the font family code in css
- I see that you wanted to center the whole thing using the margin. Try using flex or grid. Here you have helpful documentation.
- For example, like this:
main {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
"What we know is a drop, what we don't know is an ocean." ~Isaac Newton
Have fun coding!🎇
Marked as helpful
@Nnanna777
Posted
@NPM0486 yes I did omit the font
I tried margin: 0 auto to center but that only centered it to the top of the page, any idea why that didn't work
@Nnanna777
Posted
@NPM0486 plus explain height; 100vh;
@NPM0486
Posted
@Nnanna777👀
-
Most likely, the container in which you wanted to center did not have a height defined.
-
100vh is one hundred points of screen height. Vh is the unit that divides our screen into 100 parts and 1vh is 1% of the screen height. I added it in this example to make the container full screen so that we would have our module perfectly in the center of the screen.
You can read more about it 👉here
Marked as helpful
