Halloo Zusammen
Ich habe mal wieder ein Problem mit dem lieben InternetExplorer in Verbindung mit dem CSS Menü.
Hierzu den Link zur Webseite: http://www.wild-pharma.com/typo
Ich habe 2 Menü-Ebenen. Im Firefox und Safari klappt die 2. Ebene bei Hover auf. Im IE wird jedoch nur die 1. Ebene angezeigt. Muss man da wieder einen Spezial-Trick einbauen, damit der das macht? Wenn ja, wie und wo?
Untenstehend meine CSS und TS.
Vielen Dank schon mal im Voraus.
Liebe Grüsse
angsch-li
TS:
# Das Hauptmenü erstellen
MENU = HMENU
MENU.special = directory
MENU.special.value = 3
MENU {
### Erste Ebene ###
1 = TMENU
1 {
wrap = <ul class="menu">|</ul>
expAll = 1
NO.wrapItemAndSub = <li onmouseover="show(this)" onmouseout="hide(this)">|</li>
ACT < .NO
ACT = 1
ACT.ATagParams = class="active"
}
### Zweite Ebene ###
2 = TMENU
2 {
wrap = <ul onmouseover="show(this)" onmouseout="hide(this)">|</ul>
NO.allWrap = <li>|</li>
}
}
# Das Untermenü erstellen
SUBMENU= HMENU
SUBMENU.special.value = 3
SUBMENU{
entryLevel = 2
1 = TMENU
1.NO = 1
1.NO.linkWrap = <font color="#676767"> <br> <br>
}
# Das Untermenü erstellen
UMENU = HMENU
UMENU.special = list
UMENU.special.value = 5
UMENU {
1 = TMENU
1.NO = 1
1.NO.linkWrap = <font color="#ffffff"></font>
}
}
CSS:
a:link { font-size: 13px; color: #fff; font-weight: bold; font-family: Arial, Helvetica, sans-serif; text-decoration: none }
a:visited { font-size: 13px; color: #fff; font-weight: bold; font-family: Arial, Helvetica, sans-serif; text-decoration: none }
a:hover { font-size: 13px; color: #76b3e3; font-weight: bold; font-family: Arial, Helvetica, sans-serif; text-decoration: none}
a:active { font-size: 13px; color: #76b3e3; font-weight: bold; font-family: Arial, Helvetica, sans-serif; text-decoration: none; }
body { text-align: left; color: #333333; font-family: Arial, Helvetica, sans-serif; text-decoration: none; margin: 0 }
input{ font-size: 13px; font-family: Arial, Helvetica, sans-serif; vertical-align:top; margin-top:10px}
p, td {color: #333333;font-size: 13px; font-family:Arial, Helvetica, sans-serif; }
p {text-align: left; color: #333333; font-size: 13px; font-family:Arial, Helvetica, sans-serif; }
.adress {text-align: center; color: #888888; font-size: 0.85em; }
.sprache {text-align: left; color: #ffffff; font-size: 13px; }
.Balken-links {background-color:#c9cbea;}
#Menuzeile {
background-color:#0C2C80;
}
h1 {color: #0C2C80; font-size: 19px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; border-bottom: 1px solid #E8E9E9;}
h2 {color: #0078A3; font-size: 12px; font-family: Arial, Helvetica, sans-serif;font-weight: bold;}
h3 { color: #ffffff; font-size: 13px; font-family: Arial, Helvetica, sans-serif; font-weight:bold; }
h5 { padding: 3px 6px 3px 6px; color: #ffffff; font-size: 15px; font-family: Arial, Helvetica, sans-serif; font-weight:bold;background-color:#0C2C80; }
h6 {color: #ffffff; font-size: 13px; font-family: Arial, Helvetica, sans-serif; }
li {text-align: left; color: #333333;font-size: 13px; font-family:Arial, Helvetica, sans-serif;}
ul li a:link { font-size: 13px; color: #fff; font-family: Arial, Helvetica, sans-serif; text-decoration: none;}
ul li a:hover { font-size: 13px; color: #0C2C80; font-family: Arial, Helvetica, sans-serif; text-decoration: none; }
ul li a:active { font-size: 13px; color: #0C2C80; font-family: Arial, Helvetica, sans-serif; text-decoration: none; }
ul a:link { font-size: 13px; color: #fff; font-family: Arial, Helvetica, sans-serif; text-decoration: none;}
ul a:hover { font-size: 13px; color: #0C2C80; font-family: Arial, Helvetica, sans-serif; text-decoration: none; background-color:#c9cbea;}
ul a:active { font-size: 13px; color: #0C2C80; font-family: Arial, Helvetica, sans-serif; text-decoration: none; }
ul.menu, ul.menu ul {
margin: 0;
list-style-type: none;
}
/* 1. Stufe Textplatzierung */
ul.menu a {
display: block;
padding: 7px 22px 7px 22px;
font-weight:bold;
}
/* 2. Stufe Textplatzierung */
ul.menu ul a {
padding: 8 10;
font-weight:normal;
}
/* 1. Stufe */
ul.menu li {
padding: 0;
background-image: none;
background-color: #0C2C80;
float:left;
border:0 px solid #fff;
}
/* 2. Stufe */
ul.menu ul {
margin-top:0;
padding: 0 0 0 0;
position: absolute;
opacity: 0.8;
filter: alpha(opacity=80);
-moz-opacity: 0.8;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
-khtml-opacity: 0.8;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
border:1px solid #ffffff;
display:none;
min-width:160px;
}
/* IE-Hack für die Breite */
*html ul.menu ul {
width:160px;
}
/* Dies sind die Klassenstile für das Untermenü wenn sich die Maus */
/* über der Liste befindet (.hover siehe JavaScript oben) */
ul.menu ul.hover, ul.menu li.hover ul, ul.menu li:hover ul {
display:block;
}
/* 2. Stufe */
ul.menu ul li {
float:none;
background-color: #0C2C80;
}