---
title: "fehler im dropdown menü"
url: "https://www.typo3.net/d/100248-fehler-im-dropdown-menue"
source: "typo3.net"
tags: ["TYPO3","Menüs","Frage"]
created: "2010-07-26"
last_reply: "2010-07-27"
replies: 9
solved: false
page: 1
pages: 1
lang: "de"
---

# fehler im dropdown menü

TYPO3 › Menüs · 9 Antworten · gestartet 2010-07-26

## Eröffnungsbeitrag

**spatric** · 2010-07-26 · [Beitrag #1](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/1)

hi zusammen

als typo3-beginner kämpfe ich mit einem Fehler in einem drop down menü.

die unterpunkte sollten eingeblendet werden, sobald der mouszeiger auf dem jeweiligen hauptpunkt ist.

Problem: ich muss den jeweiligen Hauptpunkt zuerst anklicken und erst dann funktioniert das mit mouseover. hab jetzt keine ahnung ob das problem im typoscript liegt oder im css.

hier noch mein typoscript:

# Default PAGE object:
page = PAGE
page {

  includeCSS {

    screen = fileadmin/style.css
    scree.media = screen

  }#Ende include CSS

10 = TEMPLATE
  10.template = FILE
  10.template.file = fileadmin/startseite.html
  10.workOnSubpart = Document_Body

  10.marks {

    INHALT = CONTENT
    INHALT {
      table = tt_content
      select.orderBy = sorting
      select.where = colPos = 0

    }#Ende Content

    HEADER = IMAGE
    HEADER.file = GIFBUILDER
    HEADER.file  {

      XY = 965,220

      10 = IMAGE
      10.file.import = uploads/media/
      10.file.import.data = levelmedia:-1, slide
      10.file.import.listNum = 0
      10.file.width = 965

      20 = IMAGE
      20.file = GIFBUILDER
      20.file.XY = 965,220
      20.mask = fileadmin/image/mask.jpg

      }#ende header

       FLASH = COA
       FLASH {

     10 = HTML
     10.value=<div>
     20 = TEXT
     20.value=<!--[if !IE]> --><object type="application/x-shockwave-flash" data="fileadmin/header.swf" wmode="transparent" width="965" height="100"><!--<![endif]--><!--[if IE]><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="<http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0>" wmode=transparent width="965" height="100"><param name="movie" value="fileadmin/header.swf" /><!--><!----><param name="quality" value="high" /><param name="bgcolor" value="#fff" /><param name="loop" value="true" /><param name="menu" value="false" /><img src="fileadmin/templates/images/headergrafik.jpg" width="580" alt="bitte Flashplayer installieren" border="0" /></object><!-- <![endif]-->
     30 = HTML
     30.value=</div>
     }

      LOGO = IMAGE
      LOGO.file = fileadmin/image/logo_smatec.png
      LOGO.file.XY = 230,90

      #ENDE TOP

      #BEGIN MENU

    MAIN_MENU = HMENU
    MAIN_MENU {

### Erste Ebene ###

1 = TMENU

1  {
    	entrylevel = 0
    	NO = 1
      	noBlur = 1
      	wrap = <ul>|</ul>
	NO.wrapItemAndSub = <li>|</li>

	}

      	### Zweite Ebene ###

       	2 <.1

}#ende main_menu

    FORMULAR = IMAGE
    FORMULAR {

      file = fileadmin/image/anfragebutton.png
      params.class="button"
      stdWrap.typolink.parameter = 31
      altText = Senden Sie uns Ihre Anfrage
      title = Senden Sie uns Ihre Anfrage

      }#Ende Formular

    NEWS = CONTENT
    NEWS {
      table = tt_content
      select.orderBy = sorting
      select.where = colPos = 2

    }#Ende News

  }#Ende Marks

}#Ende Page

hier noch mein css vom navi:

/* =========  style Navigation ========== */

#navi {width:965px; height:25px; background:#999; font-size:105%;}

#navi ul {list-style:none;float:left; width:100%; background-image:url(..fileadmin/image/navi999to666.png); background-repeat:repeat-x;}

#navi li {float:left; margin: 0px 0px 0px 0px; line-height:25px; text-align:center;}

#navi a {color:#000; text-decoration:none; display:block; width:160px; border-right: 1px solid background-image:;}

#navi a:hover {text-decoration:none; display:block; color:#FFF;}

#navi li ul {margin-top:1px; width:170px; background-image:url(../fileadmin/image/subnavi999to666.png); background-repeat:repeat-x; height:100%;}

#navi li li {float:none; margin: 0px 0px 0px 0px; text-align:left; display:block;}

#navi li li a {color:#000; width:100%; padding-left:5px; padding-top:5px; border-right:none;}

#navi li li a:hover {background-image:url(../fileadmin/image/navi999to666.png); background-repeat:repeat-x; width:auto; color:#FFF;}

#navi li ul {position:absolute; left:-9999px;}

#navi li:hover ul {left:auto;}

danke schon mal für die Bemühungen einem Beginner zu helfen.

Grüße
Patric

## Antworten

### [#2](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/2) · etux · 2010-07-26

So ganz verstehe ich Dein Problem nicht. Es wäre besser, Du postest einen Link zu Deiner Site.

Dennoch:

„margin-top“ hier raus nehmen. Sonst entsteht eine 1px-höhe Hover-Lücke.
#navi li ul {
	margin-top:1px;
	…......................
}

Schreib am Anfang Deiner CSS ein CSS-Reset (falls nicht schon vorhanden)
{ margin: 0; padding: 0; }
sonst wird die Hover-Lücke noch größer.

Außerdem:

Das hier ist Mischmasch
#navi a {
	…..............................
	border-right: 1px solid background-image:;
}

Besser wäre es wenn:

UL der zweiten Ebene zum Einblenden ein „left: 0;“ bekommt, statt „left: auto;“
Den LIs  der ersten Ebene muss Du dann ein „position: relative;“ geben. Idealerweise erst beim „hover“ auf die LI.

Höhen-Angaben sind so gut wie nie nötig. Bei Elementen, die Text enthalten, sogar schädlich.

### [#3](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/3) · spatric · 2010-07-27

Hi

Vielen Dank für dein Feedback.

Hier noch mal zu meinem Problem. Bitte beachte andere noch unschöne Bestandteile (v.a. im IE funktioniert die transparente flash noch nicht,...usw.).

<http://www.fami-vlbg.at/patric/typo3/>

die Menüunterpunkte werden nur angezeigt, wenn vorher auf den jeweiligen link geklickt wird

Wäre super wenn du da ein Lösungsansatz für mich hättest.

Grüße
Patric

### [#4](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/4) · spatric · 2010-07-27

... ich meinte: "bitte beachte noch unschöne Bestandteile nicht" ;-)

### [#5](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/5) · etux · 2010-07-27

> **spatric schrieb:**
>
> Problem: ich muss den jeweiligen Hauptpunkt zuerst anklicken und erst dann funktioniert das mit mouseover. hab jetzt keine ahnung ob das problem im typoscript liegt oder im css.

Im TypoScript.

Defaultmäßig ist „expAll“ auf false (bzw. 0).

Du brauchst also in Deiner Navi ein:

expAll = 1

Ich sehe gerade - „body“ kommt bei Dir doppelt vor. :o

### [#6](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/6) · etux · 2010-07-27

Nachtrag:

Du schließt Floats nicht ein. Z.B. die floatende UL (Navigation). Sie wird nur durch die Höhen-Angabe zusammen gehalten. Höhen-Angaben solltest Du aber vermeiden.

Statt dessen lkannst Du „div#navi“ auch floaten lassen. Ein „clear“ beim „div#mitte“ beendet dann das Ganze.
Keine Sorge - „clear: both;“ bei „div#content“ habe ich gesehen. Es steht aber an der falschen Stelle – nimm es also wieder raus.

Usw.

### [#7](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/7) · spatric · 2010-07-27

hey ...

... du hast gerade ein beginner sehr glücklich gemacht. Es funkt #giggle#

ärgerlich ist nur zu wissen, dass die ganze Zeit nur das expAll das Problem war #angry#

Vielen Dank - echt super von dir

Schöne Grüße
Patric

### [#8](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/8) · etux · 2010-07-27

Bitte, gerne. Aber ...

> **spatric schrieb:**
>
> ärgerlich ist nur zu wissen, dass die ganze Zeit nur das expAll das Problem war

… noch ärgerlicher ist es, dass ich es noch gestern hätte sehen müssen.

Und jetzt ran an die CSS. #giggle#

### [#9](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/9) · etux · 2010-07-27

Noch einen Nachtrag:

ich habe auch schnell den folgenden Code überflogen.
Ich fasse es kurz zusammen:

„clear“ bei „div#mitte“ ist doch überflüssig – das Element wird ja floatet.
Eine Breiten-Angabe bringe hier mehr Stabilität (alte IEs), beachte aber das „Box-Model“ ( 2 mal 1px Border).

Es ist besser, wenn Du auch die Seitenspalte floatest – sonst besitzt sie kein BFC (Block Formatting Context). Sollten später in der Seitenspalte Elementen mit „clear“ vorkommen sind die Probleme vorprogrammiert.
Vor allem, wenn Du sie auch nach links floatest, ist eine Breiten-Angabe bei „div#mitte“ sehr ratsam.

„clear: both;“ bei "div#footer“ beendet dann die Floats – steht ja schon drin.
Übrigens würde hier auch ein „clear: left;“ völlig reichen.

Auch, bzw. gerade im Content-Bereich sind Höhen-Angaben Unfug – höchstens „min-height“. Aber vielleicht hast Du sie ja nur für die Zeit der Entwicklung rein gesetzt.

Viel Spaß noch beim Coden. #giggle#

### [#10](https://www.typo3.net/d/100248-fehler-im-dropdown-menue/10) · etux · 2010-07-27

Doch noch einen Nachtrag: :D

Auch der Header-Bereich bedarf Korrekturen.
„absolute“ positionierte Elementen brauchen einen Bezug-Punkt (Comtaining Block). Sonst richten sich die Offsets nach dem Browser-Fenster.

Aber eine „absolute“ Positionierung brauchst Du an der Stelle gar nicht.
Das Header-Bild gehört zum Inhalt der Seite nicht – nimm es also raus aus dem Quelltext und definiere es als Hintergrundbild für „div#header“ und tue auch das Logo rein in „div#header“.
Wenn das Logo doch neben der Flash-Animation erscheinen sollte – kannst Du es mit negativen „margin-bottom“ nach unten verschieben.

---

Quelle: „fehler im dropdown menü“, typo3.net, https://www.typo3.net/d/100248-fehler-im-dropdown-menue
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.