zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden CSS-Menüproblem im IE6

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 22.06.2009, 12:44
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 22.06.2009
Beiträge: 4
dark_stealth befindet sich auf einem aufstrebenden Ast
Standard CSS-Menüproblem im IE6

Hallo zusammen.

Ich habe ein Problem mit meinem CSS-Menü und dem IE6. Das Problem ist bestimmt schon an anderer Stelle besprochen worden, aber ich habe mit meiner Suche leider nichts passendes gefunden.

Auf der Seite Eintracht Oberlbbe habe ich mein Menü drin. Es sind max. 3 Ebenen, die beim Mouseover aufklappen. Im Firefox und Opera kein Problem, im IE6 klappt das Ganze nur halb. Die Untermenüs klappen auch auf, allerdings erscheint unter dem Mouseover-Menüpunkt zusätzlich ein leerer Bereich. Außerdem klappt das Menü zu, wenn ich in die dritte Ebene komme.
Ich denke mal, dass ich für den IE6 noch etwas einbauen muß, weiß aber leider nicht was. Falls es schon eine Lösung in einem anderen Beitrag gibt, wäre ein Hinweis auch super.

Hier ist mein Code für das Menü:

Code:
	
/*- Menu links */

#menuleft {
	padding: 10px 0 0 20px;
	width: 180px; 
	clear: both;
	float: left; 
	color: #FFFFFF;
	z-index: 5;
	}

#menuleft li a {
	height: 20px;
	color: #FFFFFF;
	font-size: 14px;
	display: block;
	padding: 2px 0 0 5px;
	}	
	
#menuleft li a:link, #menuleft li a:visited {
	color: #FFFFFF;
	display: block;
	padding: 2px 0 0 5px;
	}
	
#menuleft li a:hover {
	background: #D3E2F9;
	color: #000000;
	display: block;
	padding: 2px 0 0 5px;
	}

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

#menuleft li:hover ul li ul{
	display: none; 
	}
	
#menuleft ul {
	list-style: none;
	width: 120px;
	margin-left: 30px;
	padding: 0;
	}

#menuleft li ul {
	position: absolute;
	left: 120px;
	top: 0;
	display: none;
	}

	/* 1. Unterbene */
	
#menuleft ul li {
	position: relative;
	background: #005AA9;
	}
	
#menuleft ul li ul{
	list-style: none;
	width: 165px;
	margin: 0;
	padding: 0;
	}
	
#menuleft ul li a {
	display: block;
	text-decoration: none;
	padding: 2px 0 0 5px;
	border-bottom: 0;
	}

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

	/* 2. Unterbene */
	
#menuleft ul li ul li{
	position: relative;
	background: #005AA9;
	}

#menuleft li ul li ul{
	position: absolute;
	left: 165px;
	top: 0;
	display: none;
	}

#menuleft ul li ul li ul{
	list-style: none;
	width: 120px;
	margin: 0;
	padding: 0;
	}

#menuleft ul li ul li a {
	display: block;
	text-decoration: none;
	padding: 2px 0 0 5px;
	border-bottom: 0;
	}
PHP-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<? $doc_root "./"?>
<html lang="de-de"><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>Eintracht Oberlübbe</title>

<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body style="background-image: url(bilder/background.jpg);">
<div id="maincontainer">
    <div id="logo"><img src="bilder/logo1.gif" alt="Logo"></div>
    <div id="head">
        <?php include ('head.php.inc'); ?>
    </div>
    <div id="menuleft">
        <?php include ('menu.php.inc'); ?>
    </div>
    <div id="content">
        <div style="text-align: center;"><div style="text-align: center;"><img style="border: 2px solid ; width: 600px;" alt="TuS Mitglieder" src="bilder/aktive_mitglieder_mit_text.jpg"><br>
        </div>
    </div>
</div>
</body></html>
Und noch zwei Screenshots:

IE6


Firefox 3


Besten Dank schonmal.

Sascha
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 22.06.2009, 13:42
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 22.06.2009
Beiträge: 4
dark_stealth befindet sich auf einem aufstrebenden Ast
Standard

Eine Datei habe ich noch vergessen, und zwar die mit den Menüeinträgen (menu.php.inc):

PHP-Code:
        <ul>
            <li><a href="<?=$doc_root."index.php"?>">Home</a></li>
            <li><a href="#1">Verein</a>
                <ul><li><a href="<?=$doc_root."verein.php"?>">Zum Verein</a></li>
                <li><a href="<?=$doc_root."vereinsgeschichte.php"?>">Vereinsgeschichte</a></li>
                <li><a href="<?=$doc_root."aemter.php"?>">Ämter</a></li>
            </ul>
            </li>
            <li><a href="<?=$doc_root."anfahrt.php"?>">Anfahrt</a></li>
            <li><a href="#1">Mannschaften</a>
                <ul><li><a href="#1">Männer</a>
                    <ul><li><a href="<?=$doc_root."mannschaft_herren_1.php"?>">1. Männer</a></li>
                        <li><a href="<?=$doc_root."mannschaft_herren_2.php"?>">2. Männer</a></li>
                        <li><a href="<?=$doc_root."mannschaft_herren_3.php"?>">3. Männer</a></li>
                        <li><a href="<?=$doc_root."mannschaft_herren_4.php"?>">4. Männer</a></li>
                    </ul>
                    </li>
                    <li><a href="#1">Frauen</a>
                    <ul><li><a href="<?=$doc_root."mannschaft_damen_1.php"?>">1. Frauen</a></li>
                        <li><a href="<?=$doc_root."mannschaft_damen_2.php"?>">2. Frauen</a></li>
                        <li><a href="<?=$doc_root."mannschaft_damen_3.php"?>">3. Frauen</a></li>
                    </ul>
                    </li>
                    <li><a href="#1">Jugend</a>
                    <ul><li><a href="<?=$doc_root."mannschaft_a_jugend.php"?>">A-Jugend</a></li>
                        <li><a href="<?=$doc_root."mannschaft_b_jugend.php"?>">B-Jugend</a></li>
                        <li><a href="<?=$doc_root."mannschaft_c_jugend.php"?>">C-Jugend</a></li>
                        <li><a href="<?=$doc_root."mannschaft_d_jugend.php"?>">D-Jugend</a></li>
                        <li><a href="<?=$doc_root."mannschaft_e_jugend.php"?>">E-Jugend</a></li>
                    </ul>
                    </li>
                    <li><a href="#1">Mädel</a>
                    <ul><li><a href="<?=$doc_root."mannschaft_a_maedel.php"?>">A-Mädel</a></li>
                        <li><a href="<?=$doc_root."mannschaft_b_maedel.php"?>">B-Mädel</a></li>
                        <li><a href="<?=$doc_root."mannschaft_c_maedel.php"?>">C-Mädel</a></li>
                        <li><a href="<?=$doc_root."mannschaft_d_maedel.php"?>">D-Mädel</a></li>
                        <li><a href="<?=$doc_root."mannschaft_e_maedel.php"?>">E-Mädel</a></li>
                    </ul>
                    </li>
                    <li><a href="<?=$doc_root."mannschaft_minis.php"?>">Minis</a></li>
                    <li><a href="<?=$doc_root."schiedsrichter.php"?>">Schiedsrichter</a></li>
                </ul>
            </li>
            <li><a href="#1">nächste Spiele</a></li>    
            <li><a href="<?=$doc_root."trendsport.php"?>">Trendsport</a>
                <ul><li><a href="<?=$doc_root."trendsport.php#Eltern-Kind-Turnen"?>">Eltern-Kind-Turnen</a></li>
                    <li><a href="<?=$doc_root."trendsport.php#Kinderturnen"?>">Kinderturnen</a></li>
                    <li><a href="<?=$doc_root."trendsport.php#FitnessMix"?>">Fitness-Mix</a></li>
                    <li><a href="<?=$doc_root."trendsport.php#StepAerobic"?>">Step-Aerobic</a></li>
                    <li><a href="<?=$doc_root."trendsport.php#NordicWalking"?>">Nordic Walking</a></li>
                    <li><a href="<?=$doc_root."trendsport.php#Gymnastik"?>">Gymnastik</a></li>
                    <li><a href="<?=$doc_root."trendsport.php#WirbelGymnastik"?>">Wirbelsäulen.Gymnastik</a></li>
                    <li><a href="<?=$doc_root."trendsport.php#WasserGymnastik"?>">Wasser Gymnastik</a></li>
                    <li><a href="<?=$doc_root."trendsport.php#BodyinBalance"?>">Body in Balance</a></li>
                </ul>
            </li>
            <li><a href="#1">Infos</a>
                <ul><li><a href="#1">Aktuelles</a></li>
                    <li><a href="#1">Blau-Weiß aktuell</a></li>
                    <li><a href="#1">1/2-Starke</a></li>
                    <li><a href="#1">MT Ergebnisdienst</a></li>
                </ul>
            </li>
            <li><a href="<?=$doc_root."phpAlbum/index.php"?>">Fotos</a></li>
            <li><a href="#1">Impressum</a></li>    
        </ul>
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 22.06.2009, 14:44
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 22.06.2009
Beiträge: 4
dark_stealth befindet sich auf einem aufstrebenden Ast
Standard

So, einen Schritt weiter bin ich schon einmal. Habe in der CSS-Datei folgendes für den IE6 ergänzt:

Code:
* html #menuleft li {
	height: 1%;
	}
Jetzt kann ich zumindest auch in die dreitte Ebene problemlos gelangen. Nur der kleine Spalt zwischen den Menüpunkten stört mich jetzt noch.
Mit Zitat antworten
  #4 (permalink)  
Alt 22.06.2009, 16:07
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 22.06.2009
Beiträge: 4
dark_stealth befindet sich auf einem aufstrebenden Ast
Standard

So, ich hab's jetzt doch hinbekommen.
Der Spalt zwischen den Menüpunkten kommt dadurch zustande, dass der IE6 den Zeilenumbruch im Quelltext als Leerzeichen interpretiert. Da mir eine saubere Formatierung aber lieber ist, als ein ordentlich funktionierender IE, habe ich jetzt folgenden Code eingefügt:

Code:
* html #menuleft li {
	height: 1%;
	margin-bottom: -0.2em;
	}
Damit bekomme ich den Spalt zwischen den Zeilen beim IE6 weg, die anderen Browser laufen ja sowieso problemlos.
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
Redesign für Steiner Cycling Team pkipper Site- und Layoutcheck 11 09.02.2011 13:25
CSS imagemap mit Tooltip - Probleme IE6 und IE7 Evoli CSS 8 11.06.2009 10:56
Bekomme CSS Frames in IE6 nicht hin... iceman_fx CSS 8 12.03.2008 13:58
IE6 Problem mit CSS Menü träumer CSS 2 15.01.2007 17:55
CSS Problem mit IE6 breker01 CSS 9 18.12.2006 19:42


Alle Zeitangaben in WEZ +2. Es ist jetzt 12:41 Uhr.