# Technical documentation page/Navbar help

**URL:** <https://forum.freecodecamp.org/t/technical-documentation-page-navbar-help/589303>\
**Category:** Curriculum Help\
**Tags:** html, css\
**Created:** [February 1, 2023, 11:16pm UTC](https://forum.freecodecamp.org/t/technical-documentation-page-navbar-help/589303 "2023-02-01T23:16:29Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![jennypat](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jennypat/32/309974_2.png) [@jennypat](https://forum.freecodecamp.org/u/jennypat)\
**Post date:** [February 1, 2023, 11:16pm UTC](https://forum.freecodecamp.org/t/technical-documentation-page-navbar-help/589303/1 "2023-02-01T23:16:29Z")

</div>

I am working on the technical documentation page and am having trouble styling the navbar. I currently have it position fixed and located top and left zero, but it’s covering content. I can change the margin on the body so that it works, but then it doesn’t pass the test. Can anyone point me in the right direction to fix this?

Here’s the CSS I have and a screenshot.

```auto
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200&display=swap');

@media (max-width: 1250px) body{
  width:100%;
}

.mainnav{
  display:flex;
  position:fixed;
  top:0px;
  left:0px;
  
}

li{
  list-style:none;
  
}

a{
  text-decoration:none;
  cursor:pointer;
  color:black;
  display:block;
  width:200px;
  height:60px;
  font-size:26px;
  background-color:lightgrey;
  
}
a:hover{
  color:#037A36;
  transition:0.3s;
}

body{}

```

 ![Screenshot 2023-02-01 at 6.15.43 PM](https://global.discourse-cdn.com/freecodecamp/original/4X/e/e/8/ee8081afb1be596552a7a3e5acdd38e9a7c40dc7.jpeg)

---

<div class="post-metadata">

**Author:** ![JeremyLT](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jeremylt/32/291894_2.png) [@JeremyLT](https://forum.freecodecamp.org/u/JeremyLT)\
**Post date:** [February 1, 2023, 11:19pm UTC](https://forum.freecodecamp.org/t/technical-documentation-page-navbar-help/589303/2 "2023-02-01T23:19:41Z")

</div>

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (`</>`) to add backticks around text.

 ![Pre-formatted-text](https://global.discourse-cdn.com/freecodecamp/original/3X/1/b/1b18854f1059217f29370444396145cc3a0cd8ae.gif)

See [this post](https://forum.freecodecamp.org/t/forum-code-formatting/25574) to find the backtick on your keyboard.  
**Note:** Backticks (`) are not single quotes (').

---

<div class="post-metadata">

**Author:** ![system](https://global.discourse-cdn.com/freecodecamp/original/3X/e/1/e1c433102e34b46dfaa3e15d13ab9a514b127078.svg) [@system](https://forum.freecodecamp.org/u/system)\
**Post date:** [August 3, 2023, 11:20am UTC](https://forum.freecodecamp.org/t/technical-documentation-page-navbar-help/589303/3 "2023-08-03T11:20:14Z")

</div>

Closed on August 3, 2023, 11:20am UTC

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