差距在DIV頂部和底部，儘管邊距爲0

-1

我正在使用HTML項目，我在顯示div時遇到了一些問題。差距在DIV頂部和底部，儘管邊距爲0

我創建了一個「window」div，裏面有一個「windowContent」div。「窗口」div有一個邊框圖像，「windowContent」只有一個白色背景。

問題在於頂部和底部有間隙。

Result: http://i58.tinypic.com/35ckjk6.png 
Code: http://jsfiddle.net/mp4a0do3/

我試圖設置頁邊距爲0px，但仍然有同樣的問題。

任何幫助表示讚賞。

來源

2014-11-20 Petre Popescu

請務必在問題中發佈您的代碼。 – j08691 2014-11-20 18:48:37

它被稱爲「相鄰邊界」......「h3」的「邊緣頂部」。最後一個'p'的'margin-bottom'與周圍'div'元素的邊距合併。 – CBroe 2014-11-20 18:52:26

我明白了。所以h3的邊緣問題導致了這個問題。感謝澄清。 – 2014-11-20 18:58:32

添加到您的CSS去除填充第一H3的&保證金和最後P元素：

.windowContent :first-child { 
    padding-top: 0; 
    margin-top: 0; 
} 
.windowContent :last-child { 
    padding-bottom: 0; 
    margin-bottom: 0; 
}

（或創建新類做同樣的，並將其應用到2組相同的元素。）

需要注意的是很容易上看到差距，通過使用瀏覽器的開發者工具在Firefox檢查元素（或螢火蟲從何而來。）

來源

2014-11-20 19:04:06 sebnukem

差距在DIV頂部和底部，儘管邊距爲0

回答

相關問題