[Apes]

Hallöle,

bin gerade dabei eine Page für unseren Betrieb zu basteln, nur leider hänge ich im Moment an einer Stelle und komme einfach nicht weiter.

Wir wollen ein Dropdown Menü haben. Im FF geht es auch einwandfrei. Nur im IE6 gehts es nicht. (IE 7 geht wieder)

Da noch nicht alle Kunden auf IE7 umgestiegen sind, möchten wir natürlich sicherstellen, das unser Dropdown Menü überall funktioniert.

Hier mal der HTML-Code

  <div id="menuebox">
        <div id="menue">
                <div class="aussen">
<a href="" class="aussen">Startseite</a>
                </div>
                <div class="aussen">
<span class="menutag">Funktionen</span>
<a class="innen-1" href="#">Zuverlässigkeit</a>
<a class="innen" href="#">Einrichtung</a>
                </div>
                <div class="aussen">
<span class="menutag">Support</span>
<a class="innen-1" href="#">FAQ</a>
<a class="innen" href="#">Lexikon</a>
                </div>
                <div class="aussen">
<span class="menutag">Service</span>
<a class="innen-1" href="#">Download</a>
<a class="innen" href="#">Partner</a>
                </div>
                <div class="aussen">
<span class="menutag">Über uns</span>
<a class="innen-1" href="#">Kontakt</a>
<a class="innen" href="#">Impressum</a>
                </div>
        </div>

Und hier das CSS dazu

#menuebox {
position: relative;
height: 30px;
}
.stupidie {
display: none;
}
#menue {
position:absolute;
top: 6px;
left: 0;
z-index: 200;
}

#menue .aussen {
font-family: Arial;
font-size: 12px;
float: left;
display: block;
overflow: hidden;
text-decoration: none;
width: 8em;
height: 1.3em;
font-weight: bold;
text-align: center;
background-color: #000280;
color: #FFFFFF;
}
#menue .aussen:hover {
height: auto;
background-color: #000280;
color: #fff;
border-color:#000280;
}

a.innen-1 {
margin-top: 7px;
}
a.innen,
a.innen-1 {
display: block;
width: 7.9em;
padding: 2px 0;
text-decoration: none;
font-weight: normal;
background-color: #000280;
color: #fff;
margin-left: 1px;
}
a:visited.innen,
a:visited.innen-1 {
background-color: #000280;
color:#fff;
margin-left: 1px;
}
a:hover.innen,
a:hover.innen-1 {
background-color: #FFDF00;
color: #000;
}

span.menutag {
display: block;
cursor: default;
}

Wäre echt super, wenn ihr mir verraten könntet, was ich ändern muss, damit das Menü auch im IE6 funktioniert.

cya

Apes

[dblay]

Zitat

#menue .aussen:hover ...

Das kann der IE 6 nicht. Da hilft nur ein Workaround per JavaScript.

Auf dieser Seite findest du ganz unten eine Möglichkeit, auch dem IE 5-6 zu verklickern, was er zu tun hat: http://de.selfhtml.o...ionsleisten.htm

Zugegeben gefällt mir das Design des Menüs nicht so toll, aber das ist ja 1. Geschmackssache und 2. geht es auch nur ums Prinzip.

Dieser Beitrag wurde von dblay bearbeitet: 25. Oktober 2007 - 19:01