Confused with Navbar-fixed-top


Hi, please help me figure out why navbar-fixed-top swallowed the top part of my main conten, which is the first heading (

Brief description of my programming repertoire


Here’s my code:

Thank you in advance!


The fixed top navbar requires you to add padding to your <body> element in your CSS.

Fix this in your project with:

body {
  background-color: #4F6785;
  padding-top: 70px; /* adjust as desired */

From the documentation:

Body padding required

The fixed navbar will overlay your other content, unless you add padding to the top of the . Try out your own values or use our snippet below. Tip: By default, the navbar is 50px high.

body { padding-top: 70px; }

Make sure to include this after the core Bootstrap CSS.


Thank you! One more question… what does it mean Make sure to include this after the core Bootstrap CSS.? What constitutes the core Bootstrap CSS?


It means that your CSS must load last or it will not override bootstrap.css. This challenge briefly talks about the subject:

In codepen, as long as you have added Bootstrap to the CSS Settings and have all of your CSS code in the CSS Panel, you will be fine.