當在列表中放置列表時，空間上的差距

我有這個奇怪的問題，當我在div中放置一個列表時，它會在div的頂部造成巨大的空隙。是什麼導致了這個問題，我該如何解決這個問題？當在列表中放置列表時，空間上的差距

body { 
background-color:aliceblue; 
margin:0px 0px 0px 0px; 
padding:0px 0px 0px 0px; 
} 

#logosearch { 
background-color:lightgray; 
width:1024px; 
margin:0px 0px 0px 0px; 
padding:0px 0px 0px 0px; 
} 

#nav { 
background-color:lightblue; 
width:1024px; 
margin:0px 0px 0px 0px; 
padding:0px 0px 0px 0px; 
}

http://jsfiddle.net/myvegancookbook/JP899/

來源

2014-02-06 user3247313

如何發佈您的代碼，以便我們可以提供幫助？ – Jim

我試過了，但我無法弄清楚如何發佈代碼。我嘗試發佈Jfiddle鏈接，但它不會讓我。抱歉。 – user3247313

編輯你的問題，並粘貼代碼，突出顯示它，然後單擊工具欄上的代碼格式圖標 – Jim

沒有看到你的代碼，這是不可能知道的，但我懷疑你有一些CSS規則如下：在您的列表上邊距或填充。您是否嘗試過使用Firebug或其他站點分析器來查看實際應用的CSS規則？

編輯：是的，看起來你對UL保證金...添加到你的CSS：

ul { margin: 0; }

這就是你需要抵消利潤率/填充，你不像你在代碼中一樣需要每個方向的0px。

此外，考慮CSS重置，它會幫助你開始在一個已知的基線，這樣你就不會遇到這樣的問題......

這裏是你擺弄的變化作出：http://jsfiddle.net/JP899/2/

來源

2014-02-06 03:26:24 Jim

非常感謝，這讓我瘋狂了幾天！大聲笑 – user3247313

沒問題，樂意幫忙！ – Jim

您可以在您的css文件的開頭添加一些規則來重置所有值，然後開始編寫您自己的填充或邊距。您可以使用類似的東西：

html, body, div, span, applet, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, 
del, dfn, em, img, ins, kbd, q, s, samp, 
small, strike, strong, sub, sup, tt, var, 
b, u, i, center, 
dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td, 
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary, 
time, mark, audio, video { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    font-size: 100%; 
    font: inherit; 
    vertical-align: baseline; 
}

來源

2014-02-06 04:01:44 Koffer

當在列表中放置列表時，空間上的差距

回答

相關問題