Problem mit Suckerfisch Dropdown Menü

Dieses Thema im Forum "Web-Programmierung" wurde erstellt von Deepthroat, 02.03.2007.

  1. Deepthroat

    Deepthroat Thread Starter MacUser Mitglied

    Beiträge:
    138
    Zustimmungen:
    1
    MacUser seit:
    29.09.2006
    Ich verzweifle gerade ein bisschen an diesem Menü. Funktionieren tut es ja soweit, allerdings stimmt im IE (Opera und Netscape noch nicht getestet) die Breite des Menüs nicht. Es soll 200px breit sein. Und ich finde im css file einfach nicht die entsprechende angabe.
    Mit der ursprünglichen Größe funktioniert alles (auch im IE), aber dann ist das Menü zu schmal für die Links.
    Das Skript selbst stammt von hier und ist modifiziert, sodass es kompatibel sein sollte.

    Es geht um diese Seite hier, und das hier ist das zugehörige css file.

    Hoffe jemand von euch blickt da mehr durch und kann mir weiterhelfen.

    Deep
     
  2. wusa

    wusa MacUser Mitglied

    Beiträge:
    536
    Zustimmungen:
    18
    MacUser seit:
    24.08.2006
    Ich weiß, ich weiß..Suckerfish zum tausendsten mal...

    aber ich hab da grad ein Problem und bin schon ne Zeit lang am rumprobieren.

    Das ganze ist ein horizontales Dropdown(also Menuepunkte horizontal angeordnet, bei Mouseover klappen vertikale Listen aus.)
    Funzt im, FF und Safari auch ganz gut nur der IE blendet die Listen dann imm er rechts neben dem Menuepunkt ein.

    Hier mal der Quellcode
    Code:
     <div id="Menu">
      	<ul id="Nav">
    	  <li>Home</li>
    	
    	  <li>Der Hovawart
    	    <ul>
    	      <li><a href="">Zuchtgeschichte</a></li>
    	      <li><a href="">Charakter</a></li>
    	      <li><a href="">Rassenstand</a></li>
    	      <li><a href="">Bildergalerie</a></li>
    	    </ul>
    	  </li>
    	
    	  <li>Zuchtverein
    	    <ul>
    	      <li><a href="">Mitglieder</a></li>
    	      <li><a href="">Kontakt</a></li>
    	     </ul>
    	  </li>
    	  
    	   <li>Welpen
    	    <ul>
    	      <li><a href="">Welpenvermittlung</a></li>
    	      <li><a href="">Die ersten Tage</a></li>
    	     </ul>
    	  </li>
    	  
    	  <li>Downloads
    	    <ul>
    	      <li><a href="">Wallpaper</a></li>
    	      <li><a href="">Dolkumente</a></li
    	    </ul>
    	  </li>
    	</ul>
      </div>
    und das CSS dazu

    Code:
    #Nav, Nav ul {
      color: #ffffff;
      font-family: Arial;
      font-weight: bold;
      text-align: center;
      padding: 0;
      margin: 0;
      list-style: none;
      
      }
      
    #Nav a {
      display: block;
      width: 10em;
      color: #ffffff;
      text-decoration: none; 
      font-size: 85%;
    }
      
    #Nav li {
      float: left;
      width: 120px;
      border-right: 1px dashed #ffffff;
      
      
     
      }
      
    #Nav li ul {
      clear: left;
      list-style: none;
      font-family: Arial;
      font-size: 85%;
      font-weight: normal;
      text-align: left;
      position: absolute; 
      left: -999em;
      background-color: #ff6633;
      padding: 5px;
      width: 150px;
      }
      
    #Nav li ul li{
    
      border: 1px solid #ffffff;
      background-image:url(../pics/menu_li_bg.gif);
      background-repeat: repeat-y;
      width: 150px;
      margin-top: 2px;
      }
    
      
    #Nav li:hover ul, #Nav li.sfhover ul{
      left: auto;
    }
    
    #Nav a:hover{
      background-image:url(../pics/menu_li_bg_hov.gif);
      background-repeat: repeat-y;
     
Die Seite wird geladen...

Diese Seite empfehlen