angelozehr
Mitglied
Hi ihr 
Ich bin grad an einem Navigationsmenu und hab da Probleme mit der Schrift
Hier könnt ihrs euch ansehen.
Nun möchte ich natürlich, dass die Schrift nach rechts und ein bisschen nach unten verschoben würde. Habe aber keeeeinen Plan wie ich jetzt das machen kann.
Hier ist der (ja ich weiss ziemlich hässliche) Code für das Menu:
Ich bin grad an einem Navigationsmenu und hab da Probleme mit der Schrift
Hier könnt ihrs euch ansehen.
Nun möchte ich natürlich, dass die Schrift nach rechts und ein bisschen nach unten verschoben würde. Habe aber keeeeinen Plan wie ich jetzt das machen kann.
Hier ist der (ja ich weiss ziemlich hässliche) Code für das Menu:
HTML:
<!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" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
body{
font-family:Verdana, sans-serif;
font-size:12px;
color: #FFFFFF;
}
.menu1{
background-image:url(mainmenu.jpg);
background-repeat:no-repeat;
margin-left:25px;
padding-left:20px;
padding-top: 1px;
text-decoration: none;
display:block;
height: 25px;
color: #FFFFFF;
}
.subpoint{
background-image: url(subpoint.jpg);
background-repeat:no-repeat;
display: block;
margin-left: 41px;
padding-top: 1px;
padding-left: 7px;
display:block;
height: 25px;
color: #FFFFFF;
}
.submenu{
background-image: url(submenu.jpg);
background-repeat:no-repeat;
display: block;
margin-left: 41px;
padding-top: 1px;
padding-left: 7px;
display:block;
height: 25px;
color: #FFFFFF;
}
.subsubpoint{
background-image: url(subsubpoint.jpg);
background-repeat:no-repeat;
display: block;
margin-left: 57px;
padding-top: 1px;
padding-left: 7px;
display:block;
height: 25px;
color: #FFFFFF;
}
.hide{
display: none;
}
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
menu_status = new Array();
function showHide(theid){
if (document.getElementById) {
var switch_id = document.getElementById(theid);
if(menu_status[theid] != 'show') {
switch_id.className = 'show';
menu_status[theid] = 'show';
}else{
switch_id.className = 'hide';
menu_status[theid] = 'hide';
}
}
}
//-->
</script>
</head>
<body>
<a class="menu1" onclick="showHide('mymenu1')">Menu 1</a>
<div id="mymenu1" class="hide">
<a href="#" class="subpoint">Link One here</a>
<a href="#" class="subpoint">Link Two here</a>
<a href="#" class="subpoint">Link Three here</a>
<a href="#" class="subpoint">Link Four here</a>
<a class="submenu" onclick="showHide('mymenu30')">subMenu 1</a>
<div id="mymenu30" class="hide">
<a href="#" class="subsubpoint">Link Four here</a>
</div>
</div>
<a class="menu1" onclick="showHide('mymenu2')">Menu 2 </a>
<div id="mymenu2" class="hide">
<a href="#" class="subpoint">Link One here</a>
<a href="#" class="subpoint">Link Two here</a>
<a href="#" class="subpoint">Link Three here</a>
<a href="#" class="subpoint">Link Four here</a>
</div>
<a class="menu1" onclick="showHide('mymenu3')">Menu 3 </a>
<div id="mymenu3" class="hide">
<a href="#" class="subpoint">Link One here</a>
<a href="#" class="subpoint">Link Two here</a>
<a href="#" class="subpoint">Link Three here</a>
<a href="#" class="subpoint">Link Four here</a>
</div>
<a class="menu1" onclick="showHide('mymenu4')">Menu 4 </a>
<div id="mymenu4" class="hide">
<a href="#" class="subpoint">Link One here</a>
<a href="#" class="subpoint">Link Two here</a>
<a href="#" class="subpoint">Link Three here</a>
<a href="#" class="subpoint">Link Four here</a>
</div>
<a class="menu1" onclick="showHide('mymenu5')">Menu 5 </a>
<div id="mymenu5" class="hide">
<a href="#" class="subpoint">Link One here</a>
<a href="#" class="subpoint">Link Two here</a>
<a href="#" class="subpoint">Link Three here</a>
<a href="#" class="subpoint">Link Four here</a>
</div>
</body>
</html>
