Bootstrap: How to enable scroll bars?

2019-04-04 08:51发布

问题:

I use Twitter Bootstrap in one of my projects, but I have the problem that my content goes out of the browser view. Normally you see the scrollbar on the right side of the screen, but not in my case. I searched in bootstrap css file after overflow: hidden; or something like that and deleted it, but that didn't solve the problem.

Does someone know how to enable scrollbar in bootstrap css? (without bootstrap css the bars are showed)

edit:

I have find out that the problem the navbar-fixed in the black navbar which you can add. Without postition: fixed it works fine.

回答1:

I found removing the "position: fixed" for the navbar resolved this problem for me:

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

This guy also has some more useful info: http://davidlains.com/strange-twitter-bootstrap-scrolling-issue



回答2:

Make sure all the <div> from the navbar are closed. If not, the fixed property is inherited by the descending tags and the scroll bars disappears.



回答3:

Override it with your last stylesheet.
( Probably your own theme stylesheet. )

html, body {
    overflow: visible;
}


回答4:

<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>

Hope this is what you are looking for



回答5:

You are missing a closing </div> in your HTML code. For every <div class="foobar"> you must have a closing </div>. This (scrolling issue) can happen when using twitter bootstrap and not closing your divs.