Hallo Leute,
zuerst mal, schöne Pfingsttage und geniest das herliche Wetter,
ich kann es momentan nicht da mich mein Coolmenü wahnsinnig macht
ich habe Euch 2 Bilder eingefügt, anhand deren könnt Ihr mein Problem erkennnen, im ersten Bild ist zu sehen wie es momentan aussieht und im zweiten wie ich es gerne hätte.
Es soll von der Mitte nach links und die Buttons sollen untereinander sein und sich auch dann wenn man z.B. auf den Butten " Home " geht rechts davon " aus-Hoovern "
hier die Bilder:
.
.
hier wie ich es gerne hätte:
.
.
so und hier noch mein Code, damit Ihr euch ein Bild machen könnt,
was ich da ändern muss oder wo der Fehler ist, ich habe zu lange gesucht
und probiert und nicht auf die Reihe bekommen, ich Danke Euch schon mal
vielmals , den ich weis es sehr zu schätzen.
code:
-----------------------------------------------------------------------------------------------
<style type="text/css" media="screen">
<!--
/* Allgemeine Einstellungen (Schriftart, Schriftgröße...) */
body {
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px; }
/* keine Auflistungspunkte vor Navi-Links */
ul, li {
list-style-type: none;
padding: 0px;
margin: 0px; }
/* Abstand zwischen Schrift zum Rand */
li a {
padding-right: 20px;
padding-top: 5px; }
/* Coolmenü positionieren, Werte bei "top" , "left" und "width" anpassen */
div.menu {
position: absolute;
z-index: 3;
top: 650px;
left: 50%;
margin-left: -390px;
width:850px; }
/* Breite der Menüpunkte einstellen */
.menu li {
width: 160px;
float: left; }
/* Aussehen der Menüpunkte einstellen */
.menu a {
border: 0px solid #000000;
background-color: #FFFFFF;
background-image: url(URL);
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
height: 23px;
color: #00BFFF; }
/* Aussehen der Menüpunkte beim Hover Effekt */
.menu a:hover {
background-color: #FFFFFF;
background-image: url(URL);
color: #4169E1; }
#smenu1, #smenu2, #smenu3, #smenu4, #smenu5 {
font-size: 14px;
display: none;
width: 160px;
float: left; }
#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a {
font-weight: bold;
padding-top: 5px;
border-top: 0px;
cursor: pointer;
color: #FFFFFF; }
//-->
</style>
<!-- Anfang des Scriptes -->
<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>
<!-- Ende des Scriptes -->
<div class="menu">
<li><a href="javascript:void(0);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">Home</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="Home.htm">Home</a></li>
<li><a href="Team News.htm">Team News</a></li>
<li><a href="News.htm">News</a></li>
<li><a href="Links.htm">Links</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">PinPassion</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
<li><a href="Das Team.htm">Das Team</a></li>
<li><a href="Team-Bikes.htm">Team-Bikes</a></li>
<li><a href="Sponsoren.htm">Sponsoren</a></li>
<li><a href="Erfolge.htm">Erfolge</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Galerien</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
<li><a href="Team Gallery.htm">Team Gallery</a></li>
<li><a href="Bike Gallery.htm">Bike Gallery</a></li>
<li><a href="Custem & Gar..htm">Custem & Ga...</a></li>
<li><a href="In Action.htm">In Action</a></li>
<li><a href="O neal 2oo9 Calender.htm">O neal 2oo9 Calender</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">Leistungen</a>
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
<li><a href="Videos.htm">Videos</a></li>
<li><a href="Shop.htm">Shop</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">Kontakt</a>
<ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">
<li><a href="Kontakt.htm">Kontakt</a></li>
<li><a href="Impressum.htm">Impressum</a></li>
</ul>
</li>
</div>
----------------------------------------------------------------------------------------------
so ich hoffe Ihr werdet daraus schlau
Ich Danke Euch vielmals.
mfG
Nadine