M
Mrlounge
Gast
hallo,
ich schaffe es einfach nicht dieses drop down menu in einem div horizontal zu zentrieren.
ich schaffe es einfach nicht dieses drop down menu in einem div horizontal zu zentrieren.
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="content-script-type" content="text/javascript">
<meta http-equiv="content-style-type" content="text/css">
<title>Foldoutmenue Horizontal</title>
<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px;
}
ul, li
{
list-style-type: none;
padding: 0px;
margin: 0 auto;
}
.menu
{
position: absolute;
z-index: 3;
top: 10px;
}
.menu li
{
width: 140px;
float: left;
}
.menu a
{
border: 1px solid #888;
background-color: #fff;
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: default;
margin: 0px 2px;
display: block;
height: 20px;
color: #000;
}
.menu a:hover
{
background-color: #ccc;
}
#smenu1, #smenu2, #smenu3, #smenu4, #smenu5
{
font-size: 12px;
display: none;
width: 140px;
float: left;
}
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a
{
font-weight: normal;
padding-top: 2px;
border-top: 0px;
cursor: pointer;
}
//-->
</style>
<script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}
function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script>
</head>
<body>
<div class="menu">
<ul>
[*][url="javascript:void(0);"]Menu 1[/url]
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
[*][url=""]Subkategorie 1.1[/url]
[*][url=""]Subkategorie 1.2[/url]
[*][url=""]Subkategorie 1.3[/url]
[/list]
[*][url="javascript:void(0);"]Menu 2[/url]
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
[*][url=""]Subkategorie 2.1[/url]
[*][url=""]Subkategorie 2.2[/url]
[/list]
[*][url="javascript:void(0);"]Menu 3[/url]
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
[*][url=""]Subkategorie 3.1[/url]
[*][url=""]Subkategorie 3.2[/url]
[*][url=""]Subkategorie 3.3[/url]
[*][url=""]Subkategorie 3.4[/url]
[*][url=""]Subkategorie 3.5[/url]
[/list]
[*][url="javascript:void(0);"]Menu 4[/url]
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
[*][url=""]Subkategorie 4.1[/url]
[*][url=""]Subkategorie 4.2[/url]
[*][url=""]Subkategorie 4.3[/url]
[/list]
[*][url="javascript:void(0);"]Menu 5[/url]
<ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">
[*][url=""]Subkategorie 5.1[/url]
[*][url=""]Subkategorie 5.2[/url]
[*][url=""]Subkategorie 5.3[/url]
[*][url=""]Subkategorie 5.4[/url]
[*][url=""]Subkategorie 5.5[/url]
[/list]
[/list]
</div>
</body>
</html>
