由bootstrap驱动的网页中滚动不良

时间:2015-07-28 11:31:27

标签: jquery html css twitter-bootstrap

我写了一个如here所示的网页。我为所有cssjs库使用了外部CDN。 我使用了css(我自己的css):

#imgOne {
    position: fixed;
    bottom: 35%;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 10%;
    background-color: #E9E9E9;
    background-image: url(../images/Bistip-in-media.png);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-box-shadow: 0 10px 6px -6px #777;
    -moz-box-shadow: 0 10px 6px -6px #777;
    box-shadow: 0 10px 6px -6px #777;
}

#imgTwo {
    position: fixed;
    bottom: 45%;
    width: 100%;
    height: 16%;
    background-image: url(../images/Skyline.png);
    background-repeat: no-repeat;
    background-position: center center;
    box-shadow: 0px 10px 6px -6px #777;
    background-color: #FFF;
}

#formPos, #formPosOne {
    position: relative;
    width: 34%;
    height: auto;
    box-shadow: 0px 10px 6px -6px #777;
    background-color: #166BB3;
    margin-top: 8%;
    margin-left: 10%;
}

.footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 35%;
    background-color: #166bb3;
}  
html,
body {
    height: 100%;
    width: 100%;
    overflow: auto;
}  

但整页不滚动。只有包含蓝色div的部分才会滚动。我该如何解决?

1 个答案:

答案 0 :(得分:0)

这会使您的主容器内容滚动,但您需要更多地放置容器

.containerA{
    overflow-y: auto;
}