ส่วนท้ายสร้างปัญหาแถบเลื่อนแนวตั้ง

ฉันจัดการเพื่อให้ Footer ของฉันไปที่ด้านล่างของหน้าได้ แต่ด้วยเหตุผลบางอย่าง มันจึงสร้างแถบเลื่อนแนวตั้งบนหน้าของฉัน ซึ่งฉันไม่ต้องการให้ทำ

นี่คือเค้าโครงหน้าของฉันในขณะนี้ (HTML):

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

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

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

และนี่คือ 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%;
}

นี่คือภาพเล็กๆ น้อยๆ ของสิ่งที่เกิดขึ้น:

http://i.stack.imgur.com/Kgams.jpg ( ต้องลงลิงค์เพราะไม่ยอมอัพโหลดรูป)

ฉันต้องการให้ส่วนท้ายติดอยู่ที่ด้านล่างของหน้าแต่ไม่ต้องการสร้างแถบเลื่อน หากใครรู้วิธีการทำเช่นนี้โปรดแสดงความคิดเห็นขอบคุณ


person EliotE123    schedule 12.05.2014    source แหล่งที่มา
comment
@Godninall ขอบคุณสำหรับการตอบกลับ ฉันคิดว่าฉันได้ลองแล้ว มันจะไปอยู่ภายใต้ส่วนไหน?   -  person EliotE123    schedule 12.05.2014
comment
นั่นจะเป็นกระดาษห่อหลักของคุณ   -  person Godinall    schedule 12.05.2014
comment
@Godinall ขอบคุณมันทำงานได้อย่างสมบูรณ์แบบ   -  person EliotE123    schedule 12.05.2014
comment
ด้วยความยินดี. มีความสุขในการเขียนโค้ด   -  person Godinall    schedule 12.05.2014


คำตอบ (1)


เพิ่ม overflow:hidden บนองค์ประกอบ wrapper

person Lieven Vandeperre    schedule 12.05.2014