Bootstrap頁腳粘底 - 滾動條

我在這裏做錯了。我試圖擺脫滾動條（垂直）。我試過去掉了襯墊，甚至調整了高度。無法弄清楚我可能錯過了什麼。幫助非常感謝Bootstrap頁腳粘底 - 滾動條

http://jsfiddle.net/jSB53/embedded/result/

/* Sticky footer styles 
     -------------------------------------------------- */ 

html, body { 
    height: 100%;/* The html and body elements cannot have any padding or margin. */ 
} 
/* Wrapper for page content to push down footer */ 
#wrap { 
    min-height: 100%; 
    height: auto !important; 
    height: 100%; 
    /* Negative indent footer by it's height */ 
    margin: 0 auto -70px; 
    /* Pad bottom by footer height */ 
    padding: 0 0 60px; 
} 

#footer { 
    background-color: #ee3124; 
    color: #FFFFFF; 
    height: 70px; 
    padding: 20px 0 0; 
} 

.navbar-default { 
    border-bottom: 5px #ee3124 solid; 
    background-color: #fff; 
    margin-top: 20px; 
    height: 33px; 
    -webkit-box-shadow: 0 4px 4px -2px #C7C7C7; 
    -moz-box-shadow: 0 4px 4px -2px #C7C7C7; 
     box-shadow: 0 4px 4px -2px #C7C7C7; 

} 

/* Lastly, apply responsive CSS fixes as necessary */ 
@media (max-width: 767px) { 
#footer { 
    margin-left: -20px; 
    margin-right: -20px; 
    padding-left: 20px; 
    padding-right: 20px; 
} 
}

來源

2014-05-14 Shin

你的意思是水平還是垂直或兩者兼而有之？ – ZimSystem

滾動條只出現垂直=））） – Shin

底部有一個Hori滾動條，因爲如果您的媒體查詢中的負邊距。 – ZimSystem

既然你已經設置的頁腳的高度，以70像素，你需要調整#wrap底部填充太..

/* Wrapper for page content to push down footer */ 
#wrap { 
    min-height: 100%; 
    height: auto !important; 
    height: 100%; 
    /* Negative indent footer by its height */ 
    margin: 0 auto -70px; 
    /* Pad bottom by footer height */ 
    padding: 0 0 70px; 
}

http://www.bootply.com/rl77rU0NgR

來源

2014-05-14 17:10:08 ZimSystem

Bootstrap頁腳粘底 - 滾動條

回答

相關問題