# Portfolio navbar help!

**URL:** <https://forum.freecodecamp.org/t/portfolio-navbar-help/121319>\
**Category:** I Built This\
**Created:** [May 29, 2017, 9:20pm UTC](https://forum.freecodecamp.org/t/portfolio-navbar-help/121319 "2017-05-29T21:20:10Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![kkannen](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/kkannen/32/71736_2.png) [@kkannen](https://forum.freecodecamp.org/u/kkannen)\
**Post date:** [May 29, 2017, 9:20pm UTC](https://forum.freecodecamp.org/t/portfolio-navbar-help/121319/1 "2017-05-29T21:20:10Z")

</div>

I have been fighting with my navbar for way too long. First I could not get it to work, and now that it looks okay, I cannot get the text on the rest of the page to show up. I think the text is showing up behind the navbar, so I must have it coded wrong. Any help would be much appreciated.

here is the code I have written so far:  
[https://codepen.io/kkannen/pen/KmjVqx?editors=1000](https://codepen.io/kkannen/pen/KmjVqx?editors=1000)

Codepen is much too finicky, if you ask me, but as it is what we are supposed to use for these projects… I really need help because I’m about to rip my hair out.

---

<div class="post-metadata">

**Author:** ![Caleb-Ellis](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/caleb-ellis/32/64933_2.png) [@Caleb-Ellis](https://forum.freecodecamp.org/u/Caleb-Ellis)\
**Post date:** [May 29, 2017, 10:02pm UTC](https://forum.freecodecamp.org/t/portfolio-navbar-help/121319/2 "2017-05-29T22:02:21Z")

</div>

See here:  
[http://getbootstrap.com/components/#navbar-fixed-top](http://getbootstrap.com/components/#navbar-fixed-top)

Basically, you need to add padding to the body (at least 40px). So putting this in the CSS window should be enough:

body {  
padding-top: 40px;  
}

And you can increase the amount until it looks right for you. For the record, Codepen already handles head and body tags so all you need to worry about in the HTML window is the content. If you export as .zip and open the .html file you’ll see what I mean!

---

<div class="post-metadata">

**Author:** ![kkannen](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/kkannen/32/71736_2.png) [@kkannen](https://forum.freecodecamp.org/u/kkannen)\
**Post date:** [June 3, 2017, 5:21am UTC](https://forum.freecodecamp.org/t/portfolio-navbar-help/121319/3 "2017-06-03T05:21:20Z")

</div>

This worked, thank you so much!

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [June 1, 2021, 2:33pm UTC](https://forum.freecodecamp.org/t/portfolio-navbar-help/121319/4 "2021-06-01T14:33:12Z")

</div>