Not able to pass because it keeps saying my welcome section needs to be the same height as my viewport

HTML-CSS
1

This is my pen. I can’t figure out why it won’t pass.
https://codepen.io/naomisarah18/pen/ExgQeVY?editors=1100

2

Hi and welcome to the forum,

Your project passes all the tests for me. Maybe it’s a browser setting?

When you share a project, it’s a good idea to keep the test suite script in the HTML.

3

@SarahNaomi, I’m not sure what @cherylm is seeing different but your page passes 9/12 when I look at it.

As mentioned, keep the test script when forking the pen (<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>)

  • The test script should be included, with all tests passing, when you submit your projects.

You were saying one of the tests doesn’t pass because the welcome section needs to be the same height as the viewport. In your CSS you have the following for the #welcome-section declaration;

  height: 100vh;
  width: 100%;
  padding: 100px 0px 100px 0px;

why are you adding an additional 200px of padding to the top and bottom?

4

Whoa sorry about that. Not sure what happened there, and I didn’t mean to lead you astray.

1 Like
5

Add this in your code

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

It eliminates any borders and fits all of your content to the veiwport.

6

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