web-dev-qa-db-fra.com

Bootstrap: Comment activer les barres de défilement?

J'utilise Twitter Bootstrap dans l'un de mes projets, mais le problème vient du fait que mon contenu ne s'affiche pas dans la vue du navigateur. Normalement, la barre de défilement apparaît à droite de l'écran, mais pas dans mon cas. J'ai cherché dans le fichier bootstrap css après overflow: hidden; ou quelque chose du genre et je l'ai supprimé, mais cela n'a pas résolu le problème. 

Est-ce que quelqu'un sait comment activer la barre de défilement dans Bootstrap css? (sans bootstrap css les barres sont montrées)

modifier:

J'ai découvert que le problème le navbar-fixed dans la barre de navigation noire que vous pouvez ajouter. Sans postition: fixed cela fonctionne bien.

scrollscrollbartwitter-bootstrap
14
loon3x

J'ai trouvé que la suppression de "position: fixed" pour la barre de navigation a résolu ce problème pour moi:

.navbar-fixed-top, .navbar-fixed-bottom {
    /*position: fixed;*/
    right: 0;
    left: 0;
    z-index: 1030;
    margin-bottom: 0;
}

Ce mec a aussi des informations plus utiles: http://davidlains.com/strange-Twitter-bootstrap-scrolling-issue

3
Michael Christie

Assurez-vous que tous les <div> de la barre de navigation sont fermés. Sinon, la propriété fixe est héritée par les balises décroissantes et les barres de défilement disparaissent.

16
loopasam

Remplacez-le par votre dernière feuille de style.
(Probablement votre propre feuille de style de thème.)

html, body {
    overflow: visible;
}
3
B. van Bokkem

Il manque un </div> de clôture dans votre code HTML. Pour chaque <div class="foobar">, vous devez avoir un </div> de clôture. Cela (problème de défilement) peut survenir lorsque vous utilisez Twitter bootstrap sans fermer vos divs.

1
John Moore
<style type="text/css">
            body, html {
                height: 100%;
                overflow: hidden;
            }

            .navbar-inner {
                height: 40px;
            }

            .scrollable {
                height: 100%;
                overflow: auto;
            }

            .max-height {
                height: 100%;
            }

            .no-overflow {
                overflow: hidden;
            }

            .pad40-top {
                padding-top: 40px;
            }
    </style>

J'espère que c'est ce que vous cherchez

1
Vuppla Vikram