Scrollen hinter dem festen Panel in Bootstrap

Question

Ich habe eine feste Panelüberschrift mit Bootstrap und ich habe Inhalt unterhalb dieser Panel, die hinter dem Panel Überschrift gescrollt werden sollte und über der Überschrift verschwinden.

<div class="col-md-offset-3 col-md-6" style="padding-left: 0;padding-right: 0;position:fixed;z-index:100"> 
    <div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h3 class="panel-title"> 
    my panel 
    </h3> 
    </div> 
    </div> 
</div> 

Anfangsansicht:

Beim Scrollen:

Was ich erreichen möchte: die gescrollt Inhalt zwischen dem Haupt navbar und der Platte Überschrift (also über dem Feld) verschwinden .

Ich habe eine fiddle erstellt.

Answer 1

A quick-n-dirty Lösung wäre eine untere Grenze zu Ihrem nav Elemente hinzuzufügen, die die Hintergrundfarbe paßt:

Fiddle

.navbar { 
    border-bottom: 48px solid white; //body bkd color 
}