0
我有这个网站，我有一个菜单。这个菜单的CSS在Mozilla Firefox和IE上运行得非常好，但在Chrome中不起作用。在Chrome中，子菜单在它的照片下方，但是在FF和IE中它的上面（它应该是）。同时子菜单比FF和IE中的位置稍高一些。下面是代码：CSS代码适用于Firefox和IE，但不适用于Chrome。
@charset "utf-8";
/* CSS Document */
body {
background-color: #000;
background-image: url(Pictures/Plundergem-Title.png);
background-repeat: no-repeat;
background-position: 50% 0%;
height: 1500px;
}
.menu-list {
list-style-type: none;
color: #E92A27;
font-family: "Mayan Font";
font-size: 36px;
}
.menu-list li {
cursor: pointer;
}
.menu-list li a:hover {
background-color: #E92A27;
color: #000;
}
.menu-list li ul li a:hover {
background-color: #E92A27;
color: #000;
}
.menu-list li ul li a {
color: #E92A27;
text-decoration: none;
}
.menu-list li a {
text-decoration: none;
color: #E92A27;
}
@font-face{
src:url(CFCivilisationMaya-Regular.woff);
font-family:"Mayan Font";
}
.menu-block {
width: 200px;
position: fixed;
top: 200px;
left: -23px;
border-right: 3px solid #E92A27;
}
#menu-seperation {
width: 150px;
position: fixed;
left: 20px;
top: 270px;
}
#flash-container {
position: relative;
height: 500px;
width: 700px;
left: 300px;
top: 700px;
color: #FFF;
font-family: "Text Font";
font-size: 18px;
z-index: 1000;
}
#flash-container p {
color: #FFF;
font-family: "Text Font";
}
@font-face{
font-family:"Text Font";
src:url(CataneoBT-Regular.woff);
}
.scenemenu {
list-style-type:none;
color:#E92A27;
font-family:"Mayan Font";
position:fixed;
top:297px;
left:189px;
z-index:2000;
width:150px;
display:none;
}
.scenemenu li {
position:relative;
left:-50px;
z-index:2000;
}
#scenebutton:hover ul.scenemenu {
display:inline;
}
.scenemenu:hover {
display:inline;
}
#pic1 {
z-index:1000;
}
a:visited {
color:#E92A27;
}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
<script src="jquery-2.1.1.min.js"></script>
<script src="jquery-scrollto.js"></script>
<script src="animation.js"></script>
<link rel="shortcut icon" href="Pictures/Gem Icon.png" />
<title>Plundergem Adventure Game</title>
</head>
<body>
<div class="menu-block">
<ul class="menu-list">
<li><a href="index.php">HOME</a>
</li>
<hr id="menu-seperation" />
<br style="line-height: .3em" />
<li id="scenebutton">SCENES
<ul class="scenemenu">
<li><a href="Enter the Temple 2nd Scene/index.php">SCENE 2</a>
</li>
<li><a href="Go Downstairs 3rd Scene/index.php">SCENE 3</a>
</li>
</ul>
</li>
</ul>
</div>
<div id="flash-container">
<img src="Pictures/Scene_1_converted.jpg" width="700" height="504" id="pic1" />
<p>The sky is dark, the grass is dark, and even the dark is quite dark. This will do a perfect job of setting the mood. Unfortunately, it is raining, meaning that you will be unable to pull off your uncanny Batman impressions. Will you climb the temple
stairs, or will you head home?</p>
<br />
<a href="Enter the Temple 2nd Scene/index.php"><u>1. Climb the temple stairs in an over manly fashion.</u></a>
<br />
<br />
<a><u>2. Run away and never come back.</u></a>
</div>
</body>
</html>屏幕截图 - 左边是Firefox的右边是镀铬 
它在Chrome中适用于我。你可以张贴截图吗？ –
我添加了一个屏幕截图，我没有看到区别。 –
在Firefox中，我发现菜单没有打开。但在铬是好的。开幕式发生在小节中你几乎没有整体。你需要删除这个。有时候这是一个保证金。 –