CSS标题没有跨浏览器？

Question

我有一个非常奇怪的问题，我似乎无法弄明白。

JSFiddle：http://jsfiddle.net/56dVJ/2/

我所拥有的只是一个ID为'nav'的简单div，然后在css中我只是拥有以下内容。

#nav {
    width: 100%;
    height: 50px;
    float: left;
    background-color: #000000;
    color: #FFFFFF;
}

基本上我正在尝试创建一个横跨整个页面的简单标题。但是，无论我做什么，标题周围都有一个空格，就像透明边框一样。

我查看了所有可以找到的教程和帖子，似乎没有人遇到同样的问题。 ：（

我做错了什么？

Answer 1

Demo .. Source

nav周围的空格是因为margin中的body属性，所以只需将其添加到 CSS ：

body{
    margin: 0;
    padding: 0; /* additional for cross browsers */
}

如果float: left

，您也无需添加width: 100%

希望这会对你有所帮助

Answer 2

W3C specifies浏览器在body附近实现8px的默认边距。因此，您必须将其重置为0：

body { margin: 0; }

Answer 3

这是您的浏览器应用于您的正文或网页的默认保证金

使用重置css或margin：0;

Answer 4

你需要重置浏览器css所以添加这个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;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {    display: block;}body {  line-height: 1;}ol, ul {    list-style: none;}blockquote, q {   quotes: none;}blockquote:before, blockquote:after,q:before, q:after {   content: '';    content: none;}table {  border-collapse: collapse;  border-spacing: 0;}