Question

所以，我无法弄清楚为什么我的下拉菜单没有隐藏我的#nav ul设置为left：-999px所以它应该离开屏幕，但由于某种原因它不是隐藏而是只是坐着在平面视图中。顺便说一句，我的导航栏是一个PHP包含，我之前已经开始工作了，我可能只是错过了一些东西，这可能只是我的一个愚蠢的错误，随意称我为白痴，但我不能为我的生活弄清楚这次我做错了什么。

以下是托管的链接：http://addisonbwilson.com/Index.php

CSS

@charset "UTF-8";
/* CSS Document */

/*The body is responsiable for the background image, the rest of the site is divided between the sub wrapper and the includes */
/*bground tile is from http://subtlepatterns.com/white-brushed/ created by Andre Schouten, crediting him here as per the usage agreement */
body {margin-top: 0px; background-image:url(../Portfolio/IMAGES/brushed_@2X.png)} 
/* navbar is a php include*/

#navbarwrapper{positon: absolute; width:980px; height: 120px; z-index:30; background-color:#FFF;}
#navbar{width:980px; height:120px; background-image:url(../Portfolio/IMAGES/Bannerbgimg.png); background-repeat:repeat-x; z-index:31;}
#navbarlogo{width:210px; height:120px; float:left; z-index:32;}
#navbarcontent{width:770px; height:120px; float:left; font-family:Verdana, Geneva, sans-serif; z-index:32;}
#wrapper{width:980px; height:auto;}
#subwrapper{width: 980px; height: auto;}
#imagecontainer{width: 320px; height: 320px; background-color:#FFF; margin:3px 3px 3px 3px;} 


/*Unordered lists which are used to handle drop down nav bar*/
#nav{
        list-style:none;
        font-family:Helvetica, Arial, sans-serif;
        margin-bottom:10px;
        float: right;
        width:100%;
        position:relative;
    }
#nav li{float:left; margin-right:10px; position:relative;}
#nav a{display:block; padding:5px; color:#000; text-decoration:none;}
#nav a:hover{color:#fff; background:#000; text-decoration:none;}
<!-- drop down -->
#nav ul{ 
    background:#fff; 
    background:rbga(255,255,255,0);
    list-style:none;
    position:absolute;
    left:-9999px !important;}
#nav ul li{ padding-top:1px; float:none; list-style:none;}
#nav ul a{white-space:nowrap;}
#nav li:hover ul{ left:0;}
#nav li:hover a{background:#ccc; text-decoration:underline;}
#nav li:hover ul a{text-decoration:none;}
#nav li:hover ul li a:hover{background:#000;}

h1{font-size:large}
h2{font-size:larger}
h3{font-size:medium}
img {border:none}



/*link modification*/
a:link{ text-decoration: none; color:#FFF; font-family: Helvetica, Arial, sans-serif}
a:visited{text-decoration: none;color:#FFF; font-family: Helvetica, Arial, sans-serif}
a:active{text-decoration: none;color:#FFF; font-family: Helvetica, Arial, sans-serif}
a:hover{text-decoration: none; color:#FFF; font-family: Helvetica, Arial, sans-serif}

navbar.php

<link rel="stylesheet" type="text/css" href="Portfolio/CODE/pcss.css">
<div id="navbarwrapper">
<div id="navbar">
        <div id="navbarlogo"><a href="index.php"><img src="Portfolio/IMAGES/awlogo.png" /></a></div>
        <!--- nav --->
        <div id="navbarcontent">       
          <ul id="nav">
                <li><a href="#">Portfolio</a>
                    <ul>
                        <li><a href="SUBPAGES/Photography.php">Photography</a></li>
                        <li><a href="SUBPAGES/GFX.php">Graphic Art</a></li>
                        <li><a href="SUBPAGES/WebDesign.php">Web Design</a></li>
                        <li><a href="SUBPAGES/GameDesign.php">Game Design</a></li>
                    </ul>
                </li>    
                <li><a href="#">About Me</a>
                    <ul>
                        <li><a href="SUBPAGES/Resume.php">Resume</a></li>
                    </ul>
                </li>   
                <li><a href="#">Contact</a>
                    <ul>
                        <li><a href="subpages/SocialMedia.php">Social Media</a></li>
                        <li><a href="subpages/CInfo.php">Contact Information</a></li>
                    </ul>
                </li>

    </ul><!--- end nav --->

  </div> <!--- navbar --->     

</div> <!-- navbarwrapper --->

网站本身只是导航的包含标记和内容的包装，它是空的atm。

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Addison Wilson</title>
<link rel="stylesheet" type="text/css" href="Portfolio/CODE/pcss.css">
</head>

<body>

    <?php include ("Portfolio/INCLUDES/navbar.php"); ?>

    <div id="wrapper">




    </div><!--wrapper-->



</body>




</html>

Answer 1

我浏览了您链接中的网站，但我在上传的css文件中找不到下拉列表。

因此，通过在Firefox中使用实时编辑工具，我添加了您在问题中的css，

#nav ul{ 
    background:#fff; 
    background:rbga(255,255,255,0);
    list-style:none;
    position:absolute;
    left:-9999px !important;}

并且子菜单在屏幕外消失了。你能仔细检查一下服务器上的css文件是最新的吗？

我无法弄清楚为什么我的下拉菜单没有隐藏

1 个答案: