Navigation , aber wie ?

Messiahs · 11.06.2009

Bevor ich los lege hier 2 Varianten die gerne hätte.

Ich habe das ganze schon versucht mit Listen Elemente zu realisieren jedoch daran gescheitert.Der Kologe , auch aus diesem Forum konnte mich einen großen schritt voran bringen jedoch jetzt meldet er sich nicht mehr.

Ich bin mir auch nicht sicher ob das eine gute Lösung ist mit Listen Elemente zu arbeiten , ich habe versucht das teilweise Funktionierende Menü in meine Seite einzubauen - mit unterschiedlichen Ergebnisen , FireFox und IE unterscheiden sich Massiv von der Funktionalität und der Ausgabe de Submenüs.

Daher habe ich ein neues Forum Thred aufgemacht um eine alternaive möglichkeit zu erfahren.

Mfg Messiahs

Rakete · 11.06.2009

AW: Navigation , aber wie ?

Ich würde das auch mit <ul> Liste machen.

Was ist denn eigentlich dein Problem?
Du hast das Menü linksbündig und willst es zentrieren? Oder umgekehrt? Oder was ganz anderes?

Messiahs schrieb:
Bevor ich los lege hier 2 Varianten die gerne hätte.

Wie - etwa gleichzeitig?

Messiahs · 11.06.2009

AW: Navigation , aber wie ?

Wie auf dem Bild zu erkennen ist ist eine Variante davon Linksbündig und bei der anderen soll das ganze so aussehen das sich das SubMenü unter dem Text der Kategorie einblenden soll.

Rakete · 11.06.2009

AW: Navigation , aber wie ?

OK...

Magst du jetzt vlt. noch etwas darüber erzählen, wo dein Problem liegt? Was für unterschiedliche Ergebnisse zeigen dir die Brwoser denn an? Was geht noch so schief?

...und eventuell kannst ja auch mal ein bisserl Quelltext zeigen.

Ich glaube nämlich nicht das, das du eine Alternative brauchst, ich glaube es würde reichen die Fehler zu beheben.

Groozzz · 11.06.2009

AW: Navigation , aber wie ?

verstehe auch das Problem nicht.......willst du submenus machen ???

Sollen die beim hovern dann angezeigt werden?
Wenn ja, sind Listen dafür geeignet....denke aber daran, dass IE und FF anders vorformatierungen haben......also quasi erstma alles auf null stellen !

Messiahs · 11.06.2009

AW: Navigation , aber wie ?

Hier ist erst mal mein Code

HTML

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/URL]">
<html xmlns="[url=http://www.w3.org/1999/xhtml]XHTML namespace[/url]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="style.css" media="screen" type="text/css" rel="stylesheet" />
<title>Test</title>
</head>
<body>
<div id="wrapper">
  <ul>
    <li class="navi">Kategorie 1
      <ul class="submenu">
        <li>link1</li>
        <li>link1</li>
        <li>link1</li>
      </ul>
    </li>
    <li class="navi">Kategorie 2
      <ul class="submenu">
        <li>link2</li>
        <li>link2</li>
        <li>link2</li>
      </ul>
    </li>
    <li class="navi">Kategorie 3
      <ul class="submenu">
        <li>link3</li>
        <li>link3</li>
        <li>link3</li>
      </ul>
    </li>
  </ul>
</div>
</body>
</html>

CSS

Code:

*,
html,
body{  
 margin:0;
 padding:0;
}
body{
 color:#000000;
 background-color:#EFEFEF;
 font-family:Arial, Helvetica, sans-serif;
 font-size:12px;
}
h1{
 font-size:24px;
}
h2{
 font-size:20px;
}

.navi{
width:100; 
position:relative;
display:inline;
background:#97E1FD;
font-size:16px;
border:#66FFFF 2px dotted;
margin-left:20px;
}
.submenu{
display:none;
}
.navi:hover .submenu{
 position:absolute;
 top:20px;
 left:0;
 display:block;
 z-index:2;
 margin-left:1px;
 
}
.navi:hover .submenu li{
list-style-type:none;
background-color:#6699FF;
border:#66FFFF 1px dotted;
}
.navi:hover .submenu li{
 display:inline;
 background-color:#6699FF;
 border:#66FFFF 1px dotted;
 list-style-position:inside;
}

#footer{
       background:#f4fcff;
       border:2px dashed #92c6e8;
    width:98%;
    margin: 100px auto 0 auto;
    height:60px;
    botton:3px;
    left:1%;
    position:absolute;
}