This seems to be a fairly common theme, so I guess I am going to ask an oft repeated question and see if anyone can help me out. I am stuck on Story #14. I’ve got this displaying well on mobile phones and on a laptop, so by eye everything looks fine, but I cant get this to pass the computers test. Any help would be appreciated.
As far as I know, navbar is supposed to be somewhat like this:
(It’s the dock/bar you find at the top of webpages where you can search stuff or got to their home page, know about services, etc…)
<navbar id="navbar"> <ul> <li><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Contact us</a></li> <li><a href="#">Services</a></li> </ul> </navbar>
Now you need to give this entire portion/navbar element few properties in CSS like:
along with suitable padding ,margin, width , so that it doesn’t change position even when you scroll-down.
This should solve your problem;
Another advice, type your CSS and html in the respective sections that codepen.io has provided, it keeps your code clean and readable.
Thanks for your help.
I typed the whole thing up in Sublime Text first so I could get a better overview of things. Though I tried to smash through it as quick as I could so its ended up pretty poorly laid out.
I tried the fixes you suggested but Ive still got the same error. I already had the “position:fixed;” line, but the “display: inline-block;” line wasnt in the ul css before so its there now.
Did you get through though?
No sadly not. Still only 15/16
The properties i mentioned are supposed to be assigned to navbar element
Ill have another look and a bit more of a play. I just dumped that code into ul and crossed my fingers
Perfect! Thank you! In hindisight it seems pretty damn obvious I should have had a separate nav element of the css code
Glad it worked!