Your #navbar element should always be at the top of the viewport

HTML-CSS
1

so Im pretty sure I did my coding correctly however now that its changed from using codepen to FCC site now importing all my code there im stuck at that last checkmark which is " Your #navbar element should always be at the top of the viewport." kind of stuck here and if anyone has the info for me that would be greatly appreciated.

2

Please post your code and a link to the challenge you are working on. Thanks

1 Like
3

It would be good to post a link to the challenge and your current code, to help you.

From what you have told, it seems to me that you have not linked the css to the html.
You can do that by using the <link> element.

1 Like
4

yea im sorry Im new to this and not sure how to send my code from FCC tho I copied and pasted my codepen I put into FCC for both HTML and CSS which is here

5

its for the personal portfolio page project

6

Codepen automagically links your CSS. Everywhere else you need to link it yourself.

  • The new editor is as close to an external text editor as we wanted to get it. If the files for the challenge have been enabled, you can access the index.html and styles.css tabs which you should use for the respective code.
  • Two main differences between this editor and other online editors:
    • You need to link your styles.css file to your HTML (just like you would in real web-development), by adding the following line to the head of your HTML:
<link href="styles.css" />
    • You are encouraged to include the DOCTYPE, html, head and body tags for each project.
7

is there an example on how to do this? im sure ill get it eventually by research however im low on time at the moment

8

… Isn’t this an example? Is part of it unclear? What part can we explain better?

9

@osabdulla, you can use this in your <head> element if you have one or put it in the top of the html code.

10

no im sorry didn’t read that clearly the first time. Gotcha! thanks

1 Like
11

Screen Shot 2022-05-18 at 12.49.06 AM
Screen Shot 2022-05-18 at 12.49.06 AM1920×1247 221 KB

so I put it In the top of the html code however this is my screenshot I sent above …still working things out

12

You should try having the navbar positioned at the top.

Right now you applied it to the header

  header {
    position: fixed;
    top: 0px;

but these seem to be more specific than the codepen ones because it passed in codepen and not here.

When I make that change it passes for me

1 Like
13

Hello there! thanks for replying and so im not sure if this what you meant and I tried doing this here and still no pass

navbar
navbar1920×1314 218 KB

14

I rearranged the navbar to line 3 on top of the header

15

You dont need to do that, you can replace the header selector in the css code into #navbar

1 Like
16

wow that worked! thanks for that and to everyone who helped me along the way

2 Likes
17

A post was split to a new topic: Navbar always at the top of viewport

18

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