页脚创建垂直滚动条问题

I have managed to get my Footer to go to the bottom of my page, but for some reason it has created a Vertical Scroll Bar on my pages which I don't want it to do.

我设法让我的页脚移到我的页面底部,但由于某种原因它在我的页面上创建了一个垂直滚动条,我不希望它这样做。

This is my page layout at the moment (HTML):

这是我目前的页面布局(HTML):

<div class="wrapper">
    <div class="Header">
    </div>

    <div class="Main">
    </div>

    <div class="Footer">
    </div>
</div>

And this is the CSS that goes with this:

这是与此相关的CSS:

.wrapper
{
    position: relative;
    min-height: 100%;
}

.Header
{
    height: 83px;
    border: 0;
}

.Main
{
    padding-bottom: 100px;
}


.Footer
{
    background: #6a3d98; 
    position: absolute;
    bottom: 0px;
    height: 55px;
    width: 100%;
}

Here is a small picture of what happens:

以下是发生的事情的小图:

http://i.stack.imgur.com/Kgams.jpg (Have to post link as won't let me upload pic)

http://i.stack.imgur.com/Kgams.jpg(必须发布链接,因为不会让我上传图片)

I want the Footer to be stuck to the bottom of the page but not to create the scroll bar. If anyone knows how to do this please comment, Thanks.

我希望页脚粘贴到页面底部但不创建滚动条。如果有人知道怎么做,请评论,谢谢。

1 个解决方案

#1

Add overflow:hidden on the wrapper element.

添加溢出:隐藏在包装元素上。