Personal Portfolio page failing for User Story 10 and dont know why


I’m working on the last project for the responsive web design, personal portfolio page. I will say upfront I am doing bare minimum to get my feet a little wet here, and I’m failing for this user story,

User Story #10: The height of the welcome section should be equal to the height of the viewport.


Wondering if anyone had advice on what section to review from the modules and/or what to do. Thanks! Here is the code

  <!DOCTYPE html>
    @media (max-height: 800px) {
      p {
        font-size: 10px;
    #navbar {
      position: fixed;
      top: 0px;
      left: 30px;
    h1 {
      padding: 10px;
    #welcome-section {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 20px;
  <html lang="en">
      <title>Personal Portfolio Webpage</title>
      <meta charset="utf-8" />
      <nav id="navbar">
        <a href="#projects">Projects</a>  |  
        <a href="" id="profile-link" target="_blank">Visit My FreeCodeCamp Profile</a>
        <section id="welcome-section">
          <h1>Welcome to My Portfolio Page</h1>
        <section id="projects">
          <header>Technical Documentation Project</header>
          <div class="project-tile" >
            <a href="technical_documentation_page.html">Check out the doc page</a>

It would be best if you could include a link to your actual project with the FCC tests enabled so we can run the tests for ourselves in order to help you troubleshoot.

1 Like

I hope the above works.

Here’s your error (the actual numbers in the error will depend on how tall your view port is):

“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 999 to be close to 959 +/- 0”

It’s telling you that the view port height was 959 but the height of your welcome section is 999. In other words, the welcome section is too tall. I was able to fix this by adding one CSS property to the welcome section. I’ll give you a hint, it has to do with sizing, box sizing to be specific.

1 Like

Thanks! I plan to be out and about soon, but plan to check it out further in my notes.

1 Like