zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Unterschiedliche Anzeige im Firefox und IE!??!!?

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 16.10.2007, 17:16
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.08.2007
Beiträge: 7
Schengo befindet sich auf einem aufstrebenden Ast
Standard Unterschiedliche Anzeige im Firefox und IE!??!!?

Hallo zusammen.

Ich habe folgendes Problem.

Ich lasse ein Menü generieren, welches eine Liste darstellt. Maximal sind eine Oberebene und drei Unterebenen vorgesehen.
Alle Ebenen sind horizontal und die Unterebenen sind nicht sichtbar.

Wenn ein Menüpunkt angeklickt wird, wird die Unterebene sichtbar.

Das Problem ist, wenn die Unterpunkte sichtbar werden, verschieben sich die Punkte der oberen Ebene nach rechts. Das soll natürlich nicht passieren.

Wenn ich jetzt position: absolute; verwende, dann wird der gewünschte Effekt im Firefox angezeigt. Im IE verschiebt sich die untere Ebene auf die obere.
Hat jemand eine Lösung für mein Problem??

Hier der Link: Test-Navi

Ich teste z.Z. auf Firefox 2.0.0.7 und IE7

Hier der Code meiner CSS-Datei:
Code:
/*******************/
/* Für alle Ebenen */
/*******************/

a:link, a:visited, a:active, a:focus
	{  
	text-decoration: none;
	font-weight: bold;
	color: #000;
	}

a:hover 
	{ 
	color: #F00;  
	}
	
/***********/
/* Ebene 1 */
/***********/

ul#nav1
	{
	margin-top: 10px;
	}
	
ul#nav1 li
	{
	float: left;
	margin: 0 20px 3px 0;
	}

.ebene1_no ul
	{
	visibility: hidden;
	position: absolute;
	left: 0;
	}
	
.ebene1_no a:link, .ebene1_no a:visited, .ebene1_no a:active, .ebene1_no a:focus
	{
	color: #CCC;
	}
	
.ebene1_no a:hover
	{
	color: #F00;
	}
	
.ebene1_act a:link, .ebene1_act a:visited, .ebene1_act a:active, .ebene1_act a:focus
	{
	color: #F00;
	}
	
.ebene1_act ul li a:link, .ebene1_act ul li a:visited, .ebene1_act ul li a:active, .ebene1_act ul li a:focus
	{
	color: #000;
	}
	
.ebene1_act ul li a:hover
	{
	color: #F00;
	}

/***********/
/* Ebene 2 */
/***********/

ul#nav2
	{
	margin-top: 5px;
	}
	
ul#nav2 li
	{
	float: left;
	margin: 0 0 3px 0;
	}
	
.ebene2_act a:link, .ebene2_act a:visited, .ebene2_act a:active, .ebene2_act a:focus
	{
	color: #000;
	}
	
/***********/
/* Ebene 3 */
/***********/

ul#nav3
	{
	
	}
	
/***********/
/* Ebene 4 */
/***********/

ul#nav4
	{
	
	}
Vielen Dank schonmal.
Gruß Holger

Geändert von Schengo (16.10.2007 um 17:18 Uhr) Grund: Spezifikationen FF & IE
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 16.10.2007, 21:12
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.08.2007
Beiträge: 7
Schengo befindet sich auf einem aufstrebenden Ast
Standard

Hat schon jemand eine Idee? Ich bekomm es einfach nicht hin.

Es sieht so aus, als ob der IE es so interpretiert, dass er das Untermenü in die gleiche Zeile rechts daneben setzt. Ich hasse diese Diskrepanzen der Browser
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 17.10.2007, 11:58
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

Der IE kann kein position:absolute ohne left und top, er vertut sich in der statischen Position eines Elements ohne diese Offsets. Da man die left und top benötigt, erzwingt dies auch position:relative für das Elternelement.

Du verwendest id mehrfach.
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken
Mit Zitat antworten
  #4 (permalink)  
Alt 17.10.2007, 14:10
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.08.2007
Beiträge: 7
Schengo befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank erstmal für deine Antwort.

Zitat:
Der IE kann kein position:absolute ohne left und top, er vertut sich in der statischen Position eines Elements ohne diese Offsets. Da man die left und top benötigt, erzwingt dies auch position:relative für das Elternelement.
Ok. Das habe ich soweit verstanden. Wenn ich aber left:0 angebe, dann richtet IE und FF die li-Unter-Punkte am linken Bildschirmrand aus und nicht, wie es eigentlich sein sollte, unter den Punkten direkt.

Zitat:
Du verwendest id mehrfach.
Kann ich denn id nicht mehrfach verwenden, wenn id anders heißt?
Mit Zitat antworten
  #5 (permalink)  
Alt 17.10.2007, 14:25
#
XHTMLforum-Kenner
 
Registriert seit: 30.06.2005
Ort: Hamburg
Beiträge: 2.092
IChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer MenschIChao ist ein sehr geschätzer Mensch
Standard

All deine Untermenüs haben denselben Personalausweis: nav2
Dies zeigt dir der Validator.


Sicher, left:0 schiebt alles nach links. Aber auch, wenn das Elternelement position:relative bekommt?
__________________
Ingo Chao

Buch: Fortgeschrittene CSS-Techniken
Mit Zitat antworten
  #6 (permalink)  
Alt 26.10.2007, 13:14
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.08.2007
Beiträge: 7
Schengo befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
All deine Untermenüs haben denselben Personalausweis: nav2
Dies zeigt dir der Validator.
Hallo Ingo.
Das erste "Problem" habe ich schonmal gelöst. Die Test verliefen gut; also ohne Fehlermeldung


Zitat:
Sicher, left:0 schiebt alles nach links. Aber auch, wenn das Elternelement position:relative bekommt?
Ich habe jetzt wieder etwas rum experimentiert, aber ich komme leider nicht zum gewünschten Ergebnis.
Wenn ich beispielsweise im Elternelement ebene1_act position:relative; setze und die darunter liegende Ebene ebene1_act ul position:absolute; left:0; top:20px; dann bleibt die erste Ebene zusammen, aber die darunter liegende wird nach jedem Leerzeichen (oder neuem Aufzählungspunkt) in die darunterliegende Spalte geschrieben. Aber wenigstens schonmal unter jedem dazugehörigen Oberpunkt. Die li-Elemente lassen sich nicht mehr floaten.

Ich hoffe, das war jetzt nicht zu kompliziert.

Hat vielleicht noch jemand eine Idee?

Hier nochmal mein aktueller CSS-Code:
Code:
/*******************/
/* Für alle Ebenen */
/*******************/

a:link, a:visited, a:active, a:focus, a:hover
	{  
	text-decoration: none;
	font-weight: bold;
	color: #000;
	}

a:hover, a:active, a:focus
	{ 
	color: #F00;  
	}
	
/***********/
/* Ebene 1 */
/***********/

ul#nav
	{
	margin-top: 10px;
	position: relative;
	}
	
ul#nav li
	{
	float: left;
	margin: 0 20px 3px 0;
	}

.ebene1_no ul
	{
	visibility: hidden;
	position: absolute;
	left: 0;
	top: 0;
	}
	
.ebene1_no a:link, .ebene1_no a:visited
	{
	color: #CCC;
	}
	
.ebene1_no a:hover, .ebene1_no a:active, .ebene1_no a:focus
	{
	color: #F00;
	}
	
.ebene1_act
	{
	position: relative;
	}

.ebene1_act ul
	{
	position: absolute;
	left: 0;
	top: 20px;
	}

.ebene1_act a:link, .ebene1_act a:visited, .ebene1_act a:active, .ebene1_act a:focus
	{
	color: #F00;
	}
	
.ebene1_act ul li a:link, .ebene1_act ul li a:visited, .ebene1_act ul li a:active, .ebene1_act ul li a:focus
	{
	color: #000;
	}
	
.ebene1_act ul li a:hover
	{
	color: #F00;
	}

/***********/
/* Ebene 2 */
/***********/
	
ul#nav ul li
	{
	float: left;
	margin: 0 0 3px 0;
	}

.ebene2_act a:link, .ebene2_act a:visited, .ebene2_act a:active, .ebene2_act a:focus
	{
	color: #000;
	}
	
/***********/
/* Ebene 3 */
/***********/


	
/***********/
/* Ebene 4 */
/***********/
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
Unterschiedliche Anzeige im Firefox Guitarrero CSS 1 20.03.2009 00:29
Anzeige im IE okay, Firefox spinnt Irgendwas CSS 5 18.09.2008 13:01
Unterschiedliche Anzeige bei Opera kadees CSS 4 03.05.2006 20:50
Unterschiedliche Anzeige bei IE und Firefox? smiley CSS 7 12.04.2006 21:33
unterschiedliche <p> interpretation von IE und firefox simon2001 CSS 4 27.01.2006 17:31


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:43 Uhr.