zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden CSS DropDown - läuft nicht im IE6

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 17.09.2008, 17:23
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.03.2007
Beiträge: 34
NicolaibassDH befindet sich auf einem aufstrebenden Ast
Standard CSS DropDown - läuft nicht im IE6

Hallo zusammen,

ich habe ein ziemliches Problem, meine DropDown Navigation läuft nicht im IE6.

Hier mal der Code der Navigation:
Code:
<div class="navsub_tp_bg"></div>

				<h1 class="invisible">Navigation Main</h1>
				<div id="navigation_main">
						<div class="navigation_tp">
		<ul id="nav_top">
			<li><a id="nav_01" href="ddd.html" title="Nav 01">Nav 01</a>
                        <ul id="nav-01-dd">
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                        </ul>
                        
                        </li>
			<li><a id="nav_02" href="ddd.html" title="Nav 02">Nav 02</a>
                        <ul id="nav-02-dd">
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                        </ul>
                        </li>

			<li><a id="nav_03" href="ddd.html" title="Nav 03">Nav 03</a>
                        <ul id="nav-03-dd">
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                        </ul>
                        </li>
			<li><a id="nav_04" href="ddd.html" title="Nav 04">Nav 04</a>
                        <ul id="nav-04-dd">
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                        </ul>
                        </li>
			<li><a id="nav_05" href="ddd.html" title="Nav 05">Nav 05</a>
                        <ul id="nav-05-dd">
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                            <li><a href="#">test</a></li>
                        </ul>
                        </li>
		</ul>
	</div>
Hier dann der CSS Code:
Code:
ul#nav_top {
	margin-left:2px;
	margin:0em;
	padding:0em;
}

ul#nav_top a:link,
ul#nav_top a:visited {
	padding:0.40em 0 0 0;
	/*width:20%;*/
	text-align:center;
	height:1.95em;
	color:#fff;
	text-decoration:none;
	background-color:#D4003B;
	cursor:pointer;
	display:block;	
	float:left;
	font-weight:bold;
	font-size:0.80em;
	letter-spacing:0em;
}


ul#nav_top li {
	display:inline;
}

*.navigation_tp>ul#nav_top li a:hover#nav_01,
*.navigation_tp>ul#nav_top li a:hover#nav_02,
*.navigation_tp>ul#nav_top li a:hover#nav_03,
*.navigation_tp>ul#nav_top li a:hover#nav_04,
*.navigation_tp>ul#nav_top li a:hover#nav_05 {
	background-color: transparent;
	background-image:url(../images/navsub_bg_tp.png);
	color:#D4003B;
}

*.navigation_tp>ul#nav_top li a#nav_top_active, *.navigation_tp>ul#nav_top li a#nav_top_active_01, *.navigation_tp>ul#nav_top li a#nav_top_active_02, *.navigation_tp>ul#nav_top li a#nav_top_active_03, *.navigation_tp>ul#nav_top li a#nav_top_active_04, *.navigation_tp>ul#nav_top li a#nav_top_active_05 {
	background-color: transparent;
	background-image:url(../images/navsub_bg_tp.png);
	color:#D4003B;
}

/* Navigation */

ul#nav_top a#nav_01, *.navigation_tp>ul#nav_top li a#nav_top_active_01 {
	width: 12%;	
}

ul#nav_top a#nav_02, *.navigation_tp>ul#nav_top li a#nav_top_active_02 {
	width: 33%;	
}

ul#nav_top a#nav_03, *.navigation_tp>ul#nav_top li a#nav_top_active_03 {
	width: 29%;	
}

ul#nav_top a#nav_04, *.navigation_tp>ul#nav_top li a#nav_top_active_04 {
	width: 18%;	
}

ul#nav_top a#nav_05, *.navigation_tp>ul#nav_top li a#nav_top_active_05 {
	width: 8%;	
}



/* Navigation with DropDown */

ul#nav_top li ul {
	display: none;
	position: absolute;
	top: 1.9em;
}

ul#nav_top li:hover ul {
	display: block;
}

ul#nav_top li ul li {
	width: 12em;
	display: block;
	
}

ul#nav_top ul#nav-01-dd li a, ul#nav_top ul#nav-02-dd li a, ul#nav_top ul#nav-03-dd li a, ul#nav_top ul#nav-04-dd li a, ul#nav_top ul#nav-05-dd li a {
	float: none;
	background-color: transparent;
	color: #414141;
	text-align: left;
	background-color: #e6e6e6;
	border-top: 1px solid #fff;
	padding-left: 1em;
}

ul#nav-02-dd {
	left: 5.85em;
}

ul#nav-03-dd {
	left: 21.9em;
}

ul#nav-04-dd {
	left: 35.9em;
}

ul#nav-05-dd {
	left: 36.45em;
}

ul#nav_top li ul#nav-01-dd, ul#nav_top li ul#nav-02-dd, ul#nav_top li ul#nav-03-dd, ul#nav_top li ul#nav-04-dd, ul#nav_top li ul#nav-05-dd {
	display: none;
	overflow: hidden;
}

ul#nav_top li:hover ul#nav-01-dd, ul#nav_top li:hover ul#nav-02-dd, ul#nav_top li:hover ul#nav-03-dd, ul#nav_top li:hover ul#nav-04-dd, ul#nav_top li:hover ul#nav-05-dd {
	display: block;
	overflow: visible;
}
Im Header habe ich dann noch folgendes eingefügt:
Code:
<!--[if lte IE 7]>
	  <style type="text/css" media="screen">#navi { behavior:url("filadmin/templates/css/csshover.htc"); }</style>
<![endif]-->
Die .htc Datei enthält allgemeinen Code, welcher nicht mit einzelnen Klassen zusammenhängt. Die Datei kann hier runtergeladen werden.

Woran liegt es das die Navigation im Firefox wie IE7 eingeblendet wird, im IE6 jedoch nicht?

Vielen Dank für Eure Hilfe
nic.
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 17.09.2008, 18:04
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.087
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Hi,

der IE6 kennt :hover nur in Verbindung mit a.
Mit li:hover kann er nix anfangen.

Guckst du hier: Der Zuckerfisch mit JS für den IE6, oder
hier ganz ohne JS.

edit. ein Blick in die CSS-FAQ könnte auch erhellend wirken.
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 17.09.2008, 19:03
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.780
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

hubspe, auch Peter Nederlofs whatever:hover ist eine Möglichkeit, dem IE < 7 das Hovern beizubringen.
Warum es hier nicht funktioniert? Wie soll das jemand an Codeschnipseln herausfinden?
Auf der gerade verlinkten Seite finden sich Hinweise zum nötigen MIME-Type. Denen wäre vielleicht nachzugehen.

BTW: Sucker nicht Zucker. Vielleicht ist es ja kein Vertipper, sondern soll ein Witz sein. Für Benutzer der Suchfunktion sind solche "Abwandlungen" jedenfalls doof, weil nicht auffindbar.
Mit Zitat antworten
  #4 (permalink)  
Alt 17.09.2008, 19:35
Benutzerbild von hubspe
Eisen 7 ole....
XHTMLforum-Kenner
 
Registriert seit: 22.06.2007
Ort: Passau
Beiträge: 7.087
hubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblickhubspe ist ein wunderbarer Anblick
Standard

Tach Corina,

Zitat:
Zitat von fricca Beitrag anzeigen
hubspe, auch Peter Nederlofs whatever:hover ist eine Möglichkeit, dem IE < 7 das Hovern beizubringen.
danke für den Link, den kannte ich noch nicht.

Meine geposteten Links hatte ich der FAQ entnommen.

Zitat:
Zitat von fricca Beitrag anzeigen
BTW: Sucker nicht Zucker. Vielleicht ist es ja kein Vertipper, sondern soll ein Witz sein. Für Benutzer der Suchfunktion sind solche "Abwandlungen" jedenfalls doof, weil nicht auffindbar.
Ja, ich neige manchmal zu Verballhornungen.
In dem Fall auch nur, weil ich die "Verballhornung" verlinkt hatte und der Link außerdem in der FAQ zusätzlich aufgeführt war.
__________________
Ein mehrfacher Gruß aus dem Südosten
Klaus
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
CSS Dropdown Menü Moepmann123 CSS 9 03.07.2009 22:03
CSS imagemap mit Tooltip - Probleme IE6 und IE7 Evoli CSS 8 11.06.2009 09:56
3-Spalten CSS - Mittlerer Bereich sackt im IE6 ab AndreasB. CSS 6 06.05.2009 09:19
css Problem mit IE6 (current) pino.bonbon CSS 4 18.02.2009 15:06
CSS Probleme mit dem IE6 Geschan CSS 0 07.09.2007 17:32


Alle Zeitangaben in WEZ +2. Es ist jetzt 01:20 Uhr.