2017-04-22 68 views
0

我遇到了一個奇怪的問題,在頁腳和頁面底部之間存在48頁的無邊距/填充(我還注意到,如果從頁面底部刪除頁腳DOM,這個空間仍然在下一個元素的下方)。無法刪除頁面底部的空間

enter image description here

我只注意到它,當我(圖中黃色)施加的背景顏色到body。我也在使用標準化樣式表,並嘗試在頁腳上強制使用margin-bottom無效。

基本結構:

<footer> 
    <section> 
    </section> 
    <div> 
    </div> 
    <div> 
    </div> 
    <div> 
    </div> 
    <div> 
    </div> 
    <div> 
    </div> 
    <div> 
    </div> 
</footer> 

相關CSS:

* { 
    box-sizing: border-box; 
    outline: none; 
} 

html { 
    font-size: 16px; 
} 

body { 
    width: 100%; 
    background-color: #fefde1; 
    line-height: 1.5; 
    color: #656565; 
    position: relative; 
} 

footer { 
    margin-bottom: 0 !important; 
    padding-bottom: 60px; 
    width: 100%; 
    background-color: #fff; 
    font-size: 1rem; 
} 
+1

請分享一個實時片段代碼。 –

+0

設置100%高度的部分和部分應該在頁腳標記之外 –

+1

您的示例代碼本身不會導致您描述的行爲。那麼你可以發佈一些實際證明問題的代碼嗎? –

回答

0

如果它可以幫助其他人,這個問題是一個跟蹤像素腳本,儘管有height0,正在向DOM添加空間。

-1

也許你應該添加一些復位樣式。檢查導航器檢查器並選擇這些屬性,默認情況下會看到一些「繼承樣式」。

嘗試將此添加到您的車身式樣:

body { 
    margin: 0; 
    padding: 0; 
    box-sizing: border-box 

}

+0

我提到過我已經應用了標準化樣式表,其中包括:margin:0; 填充:0; border:0; font-size:100%; 字體:inherit; vertical-align:baseline; –

0

我只是不能想三件事情:

1:身體有你沒有按保證金或填充沒有注意到。

2:身體裏面有一些邊緣或邊框。

3:添加「margin-bottom:-48px;」在頁腳中。 (這是快速和污垢)