Need 2nd pair of eyes to find issue with #navbar on Technical Documentation

So my code tested out just find in the former version of this on codepen here . However in the new version even though I have things set up with what I thought was correct . I am stuck on the issue of the #navbar must always be on the left side. I am not sure if this is an issue with actual CSS of the #nav or if it is actually an issue with my media query. I have tried altering the CSS in the #navbar id using position fixed, left, absolute but none of those fix the error. What am I overlooking?

1 Like

Your issue is here

  body{
    padding: 275px;
  }

When you remove that then the test passes.

Since you are testing in a smaller window the navbar is no longer aligned to the left with the padding you had.

The same issue was there on codepen, but you probably were testing in a larger window size.
I would suggest resizing the window in codepen to under 815px and you will see the issue there too.

3 Likes

So would the opposite hold true? If I were to extend the window, would it then cause the test to pass (albeit false positive) as well?

Thank you for taking a look. I think I would have driven myself crazy not knowing what I was looking for.

it looks like the fcc editor behaves a little differently then the codepen editor when it comes to the tests and the resizing of the window

it looks like extending the window still causes it to fail in this enviornment where as the codepen editor was a little more forgiving with the resizing of the window

1 Like

Yeah I found time to test that out before seeing this response. Either way thank you for your help.

1 Like

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