Bootstrap sidebar and content under navbar
<p>Can someone help me with that issue? why my sidebar and content is under my navbar? I tried remove class and make some changes and I have no success.</p>

<p>sidebar and content should be under navbar no?</p>

<p>I know I can create that class insert in the row and fix my problem, but I am trying the solution without create any css or extra class. </p>

<pre><code>.margin-top100{
  margin-top:100px;
}
</code></pre>

<p>html:</p>

<pre><code>&lt;div class="container-fluid"&gt;
  &lt;div class="row"&gt;
    &lt;div class="col-lg-12"&gt;
      &lt;nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"&gt;
        &lt;div class="navbar-header"&gt;
          &lt;button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"&gt;
            &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;/button&gt;
          project
        &lt;/div&gt;
        &lt;div id="navbar" class="navbar-collapse collapse"&gt;
          &lt;ul class="nav navbar-nav navbar-right text-center"&gt;
            &lt;li&gt;&lt;i class="fa fa-pencil" aria-hidden="true"&gt;&lt;/i&gt;
              &lt;br&gt;link &lt;/li&gt;
            &lt;li&gt;&lt;i class="fa fa-gavel" aria-hidden="true"&gt;&lt;/i&gt;
              &lt;br&gt;link&lt;/li&gt;
            &lt;li&gt;
              &lt;br&gt; Welcome &lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
        &lt;!--/.navbar-collapse --&gt;
    &lt;/div&gt;
    &lt;/nav&gt;
  &lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="container-fluid"&gt;
  &lt;div class="row"&gt;
    &lt;div class="col-mg-2 col-sm-2"&gt; sidebar &lt;/div&gt;
    &lt;div class="col-mg-10 col-sm-10"&gt; content &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>css:</p>

<pre><code>.navbar-inverse {
  padding: 20px;
  color: white;
}
</code></pre>

<p>jsfiddle: <a href="https://jsfiddle.net/5zc66j20/" rel="nofollow">https://jsfiddle.net/5zc66j20/</a></p>

<p>thanks.</p>