Personal Portfolio Page viewport help

HTML-CSS
1

I am having an issue getting my welcome-section to match the viewport height. I am sure there is a simple explanation, but I just can’t seem to figure it out. Can you please help me out? You can view the coding here: https://codepen.io/peterboogers70/pen/jOyxZwK
Thank you.

2

@peterboogers70, when a test fails click the red button to see which test(s) are failing and text to help you correct the issue.

  • Be sure and read more than just the first line of the failing message. The ability to read and comprehend error messages is a skill you’ll need to acquire as a developer. Ask questions on what you don’t understand.

The failing text says;

The height of the welcome section should be equal to the height of the viewport.
The height of #welcome-section is not equal to the height of the viewport : expected 603 to be close to 203 +/- 0
AssertionError: The height of #welcome-section is not equal to the height of the viewport : expected 603 to be close to 203 +/- 0

I’ll agree, this is a little more cryptic than some of the other messages.
Let’s take a look at how you’ve styled…
You set the #welcome-section with the property: value; pair height: 100vh; which is good. But then you added padding: 200px;. That’s going to make your section larger.
If I remove that the tests pass successfully.
Ahh you say, but then the text in my welcome section is hidden under my navbar.
Hint:
What if that was in a div and you tried styling it?

3

Thank you. Everything passes, and the styling is done.

1 Like
4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.