nicht angemeldet
Nabend Leute,
ich habe mir eine kleine CSS Navigation (Dropdown) zusammengebastelt.
Der CSS Code ist folgeder (in einer style.css) :
----------------------------------------------------------------------------
ul.dropdown * ul {
list-style: none;
margin:0px;
padding:0px;
display:none;
position:absolute;
}
ul.dropdown li {
list-style:none;
float:left;
font-weight:bold;
padding:2px;
}
ul.dropdown li * li {
float:none;
background-color:black;
font-size:10px;
font-weight:normal;
border-left:3px solid #cfcfcf;
position: relative;
}
ul.dropdown ul * ul {
left:98%;
top:0;
width:100%;
}
ul.dropdown a {
display:block;
}
ul.dropdown ul * a {
width:15em;
}
ul.dropdown li:hover ul ul, ul.dropdown li:hover ul ul ul, ul.dropdown li:hover ul ul ul ul {
display:none;
}
ul.dropdown li:hover ul, ul.dropdown ul li:hover ul, ul.dropdown ul ul li:hover ul {
display:block;
}
ul.dropdown a.has_submenu {
background:
}
#nav {
font:10px verdana;
background-color:#f9f9f9;
}
#nav a {
color:FF7F00;
padding:3px;
text-decoration:none;
}
#nav a:hover {
background-color:CCCCCC;
color:#000;
}
#nav a.is_blind {
color:#cfcfcf;
}
#nav a.is_blind:hover {
color:#cfcfcf;
}
#nav ul {
background-color:#fff;
border:1px solid #999;
}
----------------------------------------------------------------------------
Und meine index.html (zumindest der erste Teil danachfolg einfach nur die Liste, für das Menü) :
----------------------------------------------------------------------------
<html>
<head>
<title>Test HP</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="content-style-type" content="text/css">
<link rel="stylesheet" href="css/style.css" type="text/css">
<script src="js/js.js" type="text/javascript"></script>
<script type="text/javascript"></script>
</head>
<body bgcolor="black">
<br><br /><center><img src="logo.png"></img><center>
<div id="menu">
<ul id="nav" class="dropdown" style="padding:0;margin:0;">
<li><a href="">Start </a></li>
<li><a href="">Games</a>
<ul>
<li><a href="">Playstation 1</a></li>
<li><a href="">Playstation 2</a></li>
</ul>
</li>
</div>
</body>
</html>
----------------------------------------------------------------------------
So nun habe ich zwei Probleme.
1. Die Navigation ist auf der Seite am linken Bildschirmrand ausgerichtet sie soll allerdigns in die Mitte der Seite.
2.Funktionier das Dropdownmenü mit dem IE7 nicht, was muss ich tun damit es mit allen Browsern funktioniert ?
So das wäre auch schon alles ;-)
Gruß