Bootstrap fixed navbar : padding-top-und body 100%

Für einen client, ich habe zu tun, fullscreen website im responsive design. Ich bin mit Bootstrap, mit einem festen Navigationsleiste, um meine Inhalte, ich habe ein 60px padding-top für den Körper.

Hier ist mein problem : die Bildlaufleiste zeigt systematisch, weil mein Körper haben eine Höhe von 100% und eine 60px padding-top. Ich können 'overflow: hidden;", aber dann wenn ich brauche, um eine Seite Blättern kann ich nicht mehr.

Haben Sie eine Lösung ?

Dank!

EDIT : Hier ist die Idee : http://jsfiddle.net/StFca/
In diesem Fall möchte ich die scrollbar ausgeblendet werden, denn es gibt keine Notwendigkeit es.

InformationsquelleAutor Jérémy Dutheil | 2012-08-10

  1. 2

    Anstelle der Zugabe Polsterung, um den Körper, können Sie eine margin-top: 60px - Eigenschaft eine neue Klasse oder id ein, die Sie hinzufügen können, um Ihre Haupt-Behälter mit Ihrem Inhalt, so würde es in etwa so Aussehen:

    #main-container {
    margin-top: 60px;
}

    Diese Weise können Sie für Ihre Navigationsleiste durch drücken der container selbst von ihm Weg, anstatt den Körper des Dokuments und der Scrollbalken verschwindet.

    Yep, aber das ist das gleiche problem, systematische überlauf =/
    Hier ist eine demo, die ich mit dem gleichen Ansatz, den ich oben gepostet, jsfiddle.net/CDwKV/show, die scrollbars nicht erscheinen. Vielleicht sind einige Inhalte überlaufen ist Vergangenheit der viewport in Ihrem Fall?
    Hier ist mein Fall : jeremy-dutheil.fr/barconniere, Sie können sehen, dass ich einen überlauf-auch wenn der Inhalt nicht zu groß ist =/
    Entfernen Sie die height:100% Erklärung von Ihrem html tag und es sollte funktionieren. Auch, haben Sie mehrere Container mit Ihrem Inhalt und das ist nicht die richtige bootstrap setup, so dass Sie beseitigen können, die zweite <div class="container-fluid"> ... </div> container nach Ihren wichtigsten <section>
    Es funktioniert, vielen Dank!

    InformationsquelleAutor Andres Ilich

Schreibe einen Kommentar