navigation klappt an falschen punkten auf. Wo ist der Fehler?

Status
Nicht offen für weitere Antworten.

swany

Mitglied
Hey,

ich wollte eine Navigation mit Untermenüs erstellen. Das ausklappen funktioniert soweit auch, aber leider an der falschen stelle.
Wo liegt mein Fehler? Brauch dringend HILFE!

HTML:
<html>
<head>
<title>frame-oben</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<!--[if IE]>
  <script type="text/javascript" defer="defer">
   // Script, das im IE Untermenüs anzeigt
   li = document.getElementsByTagName("li");
   for(i=0;i<li.length;i++)
   {
    li[i].onmouseover = function()
    {
     for(n=0;n<this.childNodes.length;n++)
      if(this.childNodes[n].tagName == "UL")
       this.childNodes[n].style.display = "block";
    }
    li[i].onmouseout = function()
    {
     for(n=0;n<this.childNodes.length;n++)
      if(this.childNodes[n].tagName == "UL")
       this.childNodes[n].style.display = "none";
    }
   }
  </script>
  <![endif]-->
<style type="text/css">

body{

background-image:url(orange_three_fresh.jpg);
background-repeat:no-repeat;
background-attachement:fixed;
background-position:right center;
}

</style>
</head>
<body text="#c1c1c1" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<font face="verdana" size="2">
<br><br>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Ihre junge
</font>
<body text="#ff6600" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<font color="#ff6600" face="verdana" size="5">
&nbsp;&
</font>
<body text="#c1c1c1" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">
<font face="verdana" size="2">
kreative Werbeagentur
</font>
<br>
<br>
<br>
<br>

</font>
<!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=iso-8859-1" />


<style type="text/css">
    body {
        margin:0;
        padding:0;
        font: bold 11px/1.5em Verdana;
}

h2 {
        font: bold 14px Verdana, Arial, Helvetica, sans-serif;
        color: #000;
        margin: 0px;
        padding: 0px 0px 0px 15px;
}

img {
border: none;
}
#tabs7 {
      float:center;
      width:50%;
      background:#ffffff;
      font-size:93%;
      line-height:normal;
          border-bottom:1px solid #ff6600;
      }
    #tabs7 ul {
          margin:0;
          padding:10px 10px 0 50px;
          list-style:none;
      }
    #tabs7 li {
      display:inline;
      float: left;
      postition:relative;
      margin:0;
      padding:0;
      }

    #tabs7 li ul {
      position:absolute;
      margin:0;
      padding:0;
      top: 13.0em; left:12.1em;
    }
    #tabs7 li ul li {
      float:none;
      display:block;
      margin-bottom: 0.2em;
    }

    #tabs7 a {
      float:left;
      display:block;
      background:url("tableft7[1].gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabs7 a span {
      float:left;
      display:block;
      background:url("tabright7[1].gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#999;
      }

    #tabs7 a span {float:none;}
    /* End IE5-Mac hack */
    #tabs7 a:hover span {
      color:#ff6600;
      }
    #tabs7 a:hover {
      background-position:0% -42px;
      }
    #tabs7 a:hover span {
      background-position:100% -42px;
      }
</style>
</head>

<body>


<div id="tabs7">
  <ul>
    <li><a href="ueber-uns.html" target="main" title="Vorstellung der Mitarbeiter und das Firmen Profil"><span>Über uns</span></a></li>
    <li><a href="menu.html" target="links" title=""><span>Leistungen</span></a>
      <ul>
        <li><a href="#" target="main" title=""><span>Printmedien</span></a>
          <ul>
            <li><a href="#" target="main" title=""><span>Firmenlogos</span></a></li>
            <li><a href="#" target="main" title=""><span>Firmenmaterial</span></a></li>
            <li><a href="#" target="main" title=""><span>Plakate/ Flyer</span></a></li>
          </ul>
        </li>
        <li><a href="#" target="main" title=""><span>Webdesign</span></a></li>
        <li><a href="#" target="main" title=""><span>Online Marketing</span></a></li>
      </ul>
    </li>
    <li><a href="partner.html" target="main" title=""><span>Partner</span></a></li>
    <li><a href="jobs.html" target="main" title=""><span>Jobs</span></a></li>
    <li><a href="kontakt.html" target="main" title=""><span>Kontakt</span></a></li>
  </ul>
<br /><br />
</table>
</body>
</html>
 
Hi,

hast du es schon anstelle von </table> mit </div> als Pendant zu <div id="tabs7"> versucht?

Außerdem bindest du im Dokumentkörper des Hauptdokuments weitere body-Elemente, sowie ein HTML-Grundgerüst ein, was nicht regelkonform ist, und eine weitere Ursache für den Fehler sein kann.

mfg Maik
 
danke,aber an dem </table> lag es nicht.
Und was kann ich sonst tun, außer es dort einzubauen. Weiß nicht wie ich es sonst machen soll bzw. kann...

lg
 
Da das Grundlayout für das Tab-Menü dem CSS-Code zufolge aus dem Beispiel "Tab Menu 7" stammt, stellt sich mir erstmal die Frage, wie denn überhaupt der Soll-Zustand für die Anordnung, Ausrichtung und Position der Submenüs aussieht? :confused:

Achja, einen Wert "center" für die float-Eigenschaft gibt es überhaupt nicht.

mfg Maik
 
das soll alles untereinander aufklappen...

An dem float liegt es aber auch net :(
lg
 
Zuletzt bearbeitet:
ja, so stell ich mir das vor, aber wie soll mir das jetzt helfen? *lieb frag*
Oder war das "nur" anschauungsmaterial? :)
 
Vergleich doch einfach mal die beiden Stylesheets miteinander. Bei dir fehlt nämlich noch einiges, damit die Submenüs wie gewünscht positioniert werden.

mfg Maik
 
Status
Nicht offen für weitere Antworten.
Zurück