html - div 顶部 1 px 空间，为什么？

Question

在继续使用当前导航栏之前，我需要找到一个解决方案来删除嵌套 div 上方的 1 px 空间。

有什么想法吗？顺便说一句，当我在本地查看时空间不存在，空间仅在通过服务器在线查看时显示。

提前致谢:)

顺便说一句，在 html 中有一个关闭的第一个 div，但由于某种原因它没有显示在这里。

链接:http://www.ravepreservationproject.com/test/index.htm

CSS:

body {
margin:0;
}
body a {
    text-decoration:none;
}

#header {
width: 100%;
position: absolute;
bottom: 0;
}

#header-wrap {
width: 100%;
position: fixed;
background-color: #ff9a2c;
top:0;
left:0;
}

#nav a {padding:11px 10px 12px 10px; font:300 18px 'roboto', sans-serif; float:left;}
#nav a:link { color:#ffffff; background-color:#ff9a2c; }
#nav a:visited { color:#ffffff; background-color:#ff9a2c; }
#nav a:hover { color:#ffffff; background-color:#fff; }
#nav a:active { color:#ffffff   ; background-color:#ff9a2c; }

#nav #purple:hover {background-color:#91008b;}
#nav #blue:hover {background-color:#0200ac;}
#nav #green:hover {background-color:#05bd08;}
#nav #yellow:hover {background-color:#f6fc00;}
#nav #red:hover {background-color:#f91d05;}

#nav img {margin:auto; vertical-align:middle; display:inline-block; border:0;}

HTML:

<div id="header-wrap">
<div id="header" class="clear">
    <nav id="nav">
        <a id="purple" class="nav_hide" href="#">Home</a>
        <a id="blue" class="nav_hide" href="#">About</a>
        <a id="green" class="nav_hide" href="#">Curate</a>
        <a id="red" class="nav_hide" href="#">Updates</a>
        <a id="purple" class="nav_hide" href="#">Donors</a>
        <a id="blue" class="nav_hide" href="#">Donate</a>
        <a id="green" class="nav_hide" href="#">History</a>
        <a id="red" class="nav_hide" href="#">Gallery</a>

        <a id="red" style="float:right; padding:9px 10px 14px 10px;" href="#"><img src="../../../../wt-pinit.png" height="17" width="14"></a>
        <a id="green" style="float:right; padding:9px 10px 14px 10px;" href="#"><img src="../../../../wt-facebook.png" height="17" width="8"></a>  
        <a id="blue" style="float:right; padding:9px 10px 14px 10px;" href="#"><img src="../../../../wt-twitter-comment.png" height="17" width="26"></a>
        <a id="purple" style="float:right; padding:9px 10px 14px 10px;" href="#"><img src="../../../../wt-twitter-follow.png" height="17" width="26"></a>           
    </nav>
</div>

Answer 1

为避免此类问题...始终使用一个代码，即 * {margin:0;填充:0；边框:0；
您必须在 .css 文件顶部的 .css 文件中使用此代码。意思是，在我的洋葱中，总是开始用这段代码编写 .css 文件，它永远不会在你的布局中产生问题......谢谢你...