Html Chrome中的保证金问题
除了Chrome，我的网站似乎间隔得很好。在那里，导航栏比其他导航栏向下更远，背景图像在照片上方有一点额外的空间。看这里 这是我的html：Html Chrome中的保证金问题,html,css,google-chrome,cross-browser,margin,Html,Css,Google Chrome,Cross Browser,Margin,除了Chrome，我的网站似乎间隔得很好。在那里，导航栏比其他导航栏向下更远，背景图像在照片上方有一点额外的空间。看这里 这是我的html： <!DOCTYPE html/> <html> <head> <link media="screen" type="text/css" rel="stylesheet" href="main.css"/> <title> Lovers &
<!DOCTYPE html/>
<html>
<head>
<link media="screen" type="text/css" rel="stylesheet" href="main.css"/>
<title>
Lovers & Fighters
</title>
</head>
<body id="home">
<header id="photo">
</header>
<footer>
<nav>
<ul>
<li><a href="http://chrismisterek.bandcamp.com" target="top">Music</a></li>
<li>/</li>
<li><a href="https://www.youtube.com/user/loversandfighters1" target="top">Videos</a></li>
<li>/</li>
<li><a href="http://facebook.com/loversandfighters">Social</a></li>
<li>/</li>
<li><a href="mailto:chris.misterek@gmail.com" target="top">Email</a></li>
</ul>
</nav>
</footer>
</body>
</html>
我将感谢任何帮助 因此，我最终将图像放在html元素中，并将溢出隐藏在该元素中。这似乎解决了问题。大概是这样的：
html {
background: url(images/bandbanner1.4.png) no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
overflow: hidden;
min-height: 100%;
min-width: 100%;
}
谢谢大家右侧图像的底部（我想你可能在问题中混淆了它们）看起来有点像滚动条的空间。也许您可以强制滚动条打开但不可用？您是否尝试为每个浏览器应用一个滚动条？我想，这将是一个解决方案，因为其他浏览器可以正确显示您的站点。请尝试使用px或em单元，看看它是否有效。谢谢！我不喜欢使用预先制作的样式表。更多用于锻炼和学习。而且，我最初尝试了所有像素的东西，结果比以前更糟。它只会在Safari中正确显示，而不会显示其他内容。不确定如何使滚动不可用？我试图隐藏溢出，但随后整个网站都有了白色边框。我想让这些图像稍微溢出一点。
html {
background: url(images/bandbanner1.4.png) no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
overflow: hidden;
min-height: 100%;
min-width: 100%;
}