好吧，我想你可以说这个网站看起来很近，并且关闭了＃34;如何我想要它对别人来说是好的，但不是我，因为我是一个完美主义者。我也是所有这些html和CSS的新手，所以你可以想象我生命中的斗争。我有两个div，分别是topred和top yellow。然后我有一个滑块，然后是导航栏（导航栏）。我希望所有这些元素能够＃34;堆叠＆＃34;如果这是有道理的话。如果你想用图像加载它，你可以看出滑块与topyellow完全匹配。导航栏和滑块之间的间隙也很小。它杀了我的原因虽然它在chrome中看起来不错和不可用，我可以在IE中看到它。
这只是因为我缺乏经验。我可以向你保证，我已经花了好几个小时试图解决这个问题。现在是时候问专家了。说真的，我打赌我想成为一个天才。别担心，我已经删除了所有我的＆＃34;浮动：中心＆＃34;＆＃39; lol
BTW这是我为退伍军人做的一个志愿者项目，这是一个很好的回馈方式
我只是花了一些时间来清理它！
<head>
<link rel="shortcut icon" href="bavafavicon"/>
<title>Berlin Airlift Veterans Association: News</title>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body id="news">
<div id="topyellow"></div>
<div id="topred"></div>
<div id="left"></div>
<div id="leftblue"></div>
<div id="right"></div>
<div id="container">
<div id="slider">
<script type="text/javascript">
var i = 0; var path = new Array();
path[0] = "1.jpg";
path[1] = "2.jpg";
path[2] = "3.jpg";
path[3] = "4.jpg";
path[4] = "5.jpg";
path[5] = "6.jpg";
function swapImage()
{
document.slide.src = path[i];
if(i < path.length - 1) i++;
else i = 0;
setTimeout("swapImage()",5500);
}
</script>
<img name="slide"/>
</div>
<ul id="head_nav">
<li><a href="index.htm" class="currentButton">NEWS</a></li>
<li><a href="aboutbava.htm" class="button">ABOUT BAVA</a></li>
<li><a href="history.htm" class="button">HISTORY</a></li>
<li><a href="biographies.htm" class="button">BIOGRAPHIES</a></li>
<li><a href="calendar.htm" class="button">CALENDAR</a></li>
<li><a href="contact.htm" class="button">CONTACT</a></li>
<li><a href="links.htm" class="button">LINKS</a></li>
<li><a href="donate.htm" class="button">DONATE</a></li>
</ul>
<div id="headlogo">
<img src="BAVA.png" alt="BAVA logo" width="150" height="150"/>
</div>
<div id="subscribe">Sign up for BAVA updates!<br>
<img src="emailBomb.png" alt="emailBomb" id="emailBomb" width="150" height="300"/>
<form action="demo_form.asp">
E-mail: <input type="email" name="userid">
<input type="submit" value="Submit"><br>
</form>
<script type="text/javascript">
function GetClock(){
tzOffset = +2;
d = new Date();
dx = d.toGMTString();
dx = dx.substr(0,dx.length -3);
d.setTime(Date.parse(dx))
d.setHours(d.getHours() + tzOffset);
nday = d.getDay();
nmonth = d.getMonth();
ndate = d.getDate();
nyear = d.getYear();
nhour = d.getHours();
nmin = d.getMinutes();
if(nyear<1000) nyear=nyear+1900;
if(nmin <= 9){nmin="0"+nmin}
document.getElementById('berlinClock').innerHTML=""+(nmonth+1)+"/"+ndate+"/"+nyear+" "+nhour+":"+nmin+"";
setTimeout("GetClock()", 1000);
}
</script>
<script type="text/javascript" language="javascript">
window.onload = function() { swapImage(); GetClock(); };
</script>
<div id="berlinClock"></div>
</div>
</div>
<footer>
<div id="footer">
<p><i>15 N. College Ave, Newton, NC 28658 | (828) 466-3410</i></p>
</div>
</footer>
</body>
这是我的CSS，请不要笑......
body {margin:0px; padding:0;min-width: 1100px;}
#container {position:absolute; display:block; width:100%; height:100%}
#center {margin:0px}
#topred {z-index:1; top: 0; left: 0; right:0; height: .6%; width: 100%; background: rgb(211,5,24); position:absolute; display:block}
#topyellow {z-index:1 ;top: .6%; left: 0; right:0; height: .9%; width: 100%; background: rgb(253,248,12); position:absolute; display:block }
#left, #right {top: 0; bottom: 0; width: 19.5%; background-color: black; position: fixed}
#left {left: 0}
#right {right: 0}
#leftblue {left:19.5%;top: 0; bottom: 0; width: .35%; background-color: rgb(8,44,180); position: fixed}
#slider {position:relative;display:block; margin-top:.6%;width: 100%; max-width: 875px; height:350px;margin-bottom:0px;margin-left: auto;
margin-right:auto; padding-bottom:0px}
#headlogo {display: block; position: absolute; left: 14.5%; top:5%}
#subscribe {display: block; position: absolute; top:388px; right:0; width:19.5%; text-align:center; color: white}
#head_nav {z-index:1;position:relative;text-align: center;margin-left: auto;margin-right:auto;padding:0; margin-top:0px; margin-bottom:none; width:975px; border:0}
#head_nav li {display:inline;margin: 0.0px}
#emailBomb {padding-bottom: 10px}
#berlinTime {display: block; position: relative; top:388px; left:0; width:19.5%; text-align:center; color: red}
#footer {z-index:-1; padding-top:99%; font-size:10; color:black; position: relative; width:100%; text-align:center}
.currentButton {
-moz-box-shadow:inset 0px 0px 0px 0px #d3051a;
-webkit-box-shadow:inset 0px 0px 0px 0px #d3051a;
box-shadow:inset 0px 0px 0px 0px #d3051a;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #000000), color-stop(1, #000000) );
background:-moz-linear-gradient( center top, #000000 5%, #000000 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000');
background-color:#000000;
-webkit-border-top-left-radius:0px;
-moz-border-radius-topleft:0px;
border-top-left-radius:0px;
-webkit-border-top-right-radius:0px;
-moz-border-radius-topright:0px;
border-top-right-radius:0px;
-webkit-border-bottom-right-radius:20px;
-moz-border-radius-bottomright:20px;
border-bottom-right-radius:20px;
-webkit-border-bottom-left-radius:20px;
-moz-border-radius-bottomleft:20px;
border-bottom-left-radius:20px;
text-indent:0;
display:inline-block;
color:rgb(211,5,24);
font-family:Arial;
font-size:14px;
font-weight:bold;
font-style:normal;
height:33pxpx;
line-height:33px;
width:105px;
text-decoration:none;
text-align:center;}
.currentButton:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #000000), color-stop(1, #000000) );
background:-moz-linear-gradient( center top, #000000 5%, #000000 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000');
background-color:#000000;color:rgb(211,5,24);}
.currentutton:active {
position:relative;
top:1px;}
.button {
-moz-box-shadow:inset 0px 0px 0px 0px #d3051a;
-webkit-box-shadow:inset 0px 0px 0px 0px #d3051a;
box-shadow:inset 0px 0px 0px 0px #d3051a;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #000000), color-stop(1, #000000) );
background:-moz-linear-gradient( center top, #000000 5%, #000000 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000');
background-color:#000000;
-webkit-border-top-left-radius:0px;
-moz-border-radius-topleft:0px;
border-top-left-radius:0px;
-webkit-border-top-right-radius:0px;
-moz-border-radius-topright:0px;
border-top-right-radius:0px;
-webkit-border-bottom-right-radius:20px;
-moz-border-radius-bottomright:20px;
border-bottom-right-radius:20px;
-webkit-border-bottom-left-radius:20px;
-moz-border-radius-bottomleft:20px;
border-bottom-left-radius:20px;
text-indent:0;
display:inline-block;
color:#fdf902;
font-family:Arial;
font-size:14px;
font-weight:bold;
font-style:normal;
height:33pxpx;
line-height:33px;
width:105px;
text-decoration:none;
text-align:center;}
.button:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #000000), color-stop(1, #000000) );
background:-moz-linear-gradient( center top, #000000 5%, #000000 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000');
background-color:#000000;color:rgb(211,5,24);}
.button:active {
position:relative;
top:1px;}
答案 0 :(得分：0)
我弄清楚你的问题是导航和滑块之间的差距。您在导航上设置了子像素边距。删除边距或将其设置为0.
#head_nav li {
display:inline;
/*margin: 0.3px; remove this */
}