Formatierungsproblem Navigation
-
- ConPresso-User
- Beiträge: 34
- Registriert: 31.08.2005 16:46
- Wohnort: Uedem (Kreis Kleve)
- Danksagung erhalten: 1 Mal
Formatierungsproblem Navigation
Ich habe ein Problem mit der Formatierung der automatischen Navigation. Die Änderung der Schriftfarbe der aktiven Rubrik funktioniert zwar im Firefox, nicht jedoch im Internet Explorer (getestet mit den Versionen 7 und 6). Hat jemand eine Idee, woran dies liegen kann?
Nachfolgend die Formatierungen im css:
#menu{line-height:1.8em;font-weight:bold;}
#menu ul{text-align:left;margin:0;padding:10px;}
#menu li{border-bottom:1px solid #B0C4D8;width:130px;list-style-type:none;padding:2px 0;}
#menu a:link{text-decoration:none;color:#fff;font-size:10pt;}
#menu a:visited{text-decoration:none;color:#fff;font-size:10pt;}
#menu a:hover{color:#fbd618;}
#menu li.active a{color:#fbd618;}
und der generierte Quelltext:
<div id="rahmen">
<div id="seite">
<div class="links">
<div id="menu">
<ul><li><a href="http://www.fdp-online.info/portal/Rheur ... /li><li><a href="http://www.fdp-online.info/portal/Rheur ... a></li><li class="active"><a href="http://www.fdp-online.info/portal/Rheur ... /li><li><a href="http://www.fdp-online.info/portal/Rheur ... ></li></ul> </div></div>
Herzlichen Dank für Eure Hinweise und schon einmal einen guten Rutsch!
Ralf
Nachfolgend die Formatierungen im css:
#menu{line-height:1.8em;font-weight:bold;}
#menu ul{text-align:left;margin:0;padding:10px;}
#menu li{border-bottom:1px solid #B0C4D8;width:130px;list-style-type:none;padding:2px 0;}
#menu a:link{text-decoration:none;color:#fff;font-size:10pt;}
#menu a:visited{text-decoration:none;color:#fff;font-size:10pt;}
#menu a:hover{color:#fbd618;}
#menu li.active a{color:#fbd618;}
und der generierte Quelltext:
<div id="rahmen">
<div id="seite">
<div class="links">
<div id="menu">
<ul><li><a href="http://www.fdp-online.info/portal/Rheur ... /li><li><a href="http://www.fdp-online.info/portal/Rheur ... a></li><li class="active"><a href="http://www.fdp-online.info/portal/Rheur ... /li><li><a href="http://www.fdp-online.info/portal/Rheur ... ></li></ul> </div></div>
Herzlichen Dank für Eure Hinweise und schon einmal einen guten Rutsch!
Ralf
- Matthias V
- Modul-Entwickler
- Beiträge: 1251
- Registriert: 01.01.1970 01:00
- Wohnort: Sondershausen
- Hat sich bedankt: 54 Mal
- Danksagung erhalten: 147 Mal
- Kontaktdaten:
- MarkusR
- Handbuchversteher
- Beiträge: 7361
- Registriert: 01.01.1970 01:00
- Hat sich bedankt: 110 Mal
- Danksagung erhalten: 933 Mal
- Kontaktdaten:
Du solltest in den zusätzlichen Pseudoklassen (die Du im Grunde gar nicht brauchst) die Farbangaben weglassen:
#menu a:link{text-decoration:none;color:#fff;font-size:10pt;}
#menu a:visited{text-decoration:none;color:#fff;font-size:10pt;}
#menu a:link{text-decoration:none;color:#fff;font-size:10pt;}
#menu a:visited{text-decoration:none;color:#fff;font-size:10pt;}
Ciao Markus
ConPresso-Module
Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!
Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
ConPresso-Module
Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!
Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
-
- ConPresso-User
- Beiträge: 34
- Registriert: 31.08.2005 16:46
- Wohnort: Uedem (Kreis Kleve)
- Danksagung erhalten: 1 Mal
Ein Schritt weiter: böses Wort gefunden
Einen Schritt bin ich nun weiter, im IE 7 funktioniert es nun richtig. Im Doctype stand statt: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> ein transitional nach dem 4.01. Nachdem ich dies entfernt habe, funktioniert es im IE 7 wie gewünscht. der alte 6er bleibt allerdings unbeeindruckt. Gibt es da evtl. noch einen Tip?
- MarkusR
- Handbuchversteher
- Beiträge: 7361
- Registriert: 01.01.1970 01:00
- Hat sich bedankt: 110 Mal
- Danksagung erhalten: 933 Mal
- Kontaktdaten:
Die benötigt er solange Du keine globale Farbangabe machst (also nur #menu a).
Hast Du die CSS-Datei denn auch neu geladen? Strg+F5?
Ich hatte es mit einer Kopie getestet...
Hast Du die CSS-Datei denn auch neu geladen? Strg+F5?
Ich hatte es mit einer Kopie getestet...
Ciao Markus
ConPresso-Module
Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!
Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
ConPresso-Module
Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!
Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
- MarkusR
- Handbuchversteher
- Beiträge: 7361
- Registriert: 01.01.1970 01:00
- Hat sich bedankt: 110 Mal
- Danksagung erhalten: 933 Mal
- Kontaktdaten:
Ich habe mal
http://www.fdp-online.info/portal/Rheurdt
auf einem anderen Rechner aufgerufen (der das CSS noch nicht im Cache hat) und sehe deutlich die aktiven Punkte
Das gilt für IE7 und FF2
http://www.fdp-online.info/portal/Rheurdt
auf einem anderen Rechner aufgerufen (der das CSS noch nicht im Cache hat) und sehe deutlich die aktiven Punkte
Das gilt für IE7 und FF2
Ciao Markus
ConPresso-Module
Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!
Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
ConPresso-Module
Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!
Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
-
- ConPresso-User
- Beiträge: 34
- Registriert: 31.08.2005 16:46
- Wohnort: Uedem (Kreis Kleve)
- Danksagung erhalten: 1 Mal
Danke Markus,
da haben sich offenbar unsere Bemühungen überschnitten. Im IE 7 funktioniert es inzwischen einwandfrei (soweit für mich erkennbar aufgrund des korrigierten doctype) lediglich im IE 6 fehlt die Kennzeichnung, was jedoch verzichtbar erscheint, falls Du nicht noch einen gezielten Tip hättest.
Auf jedenfall herzlichen Dank!
Ralf
da haben sich offenbar unsere Bemühungen überschnitten. Im IE 7 funktioniert es inzwischen einwandfrei (soweit für mich erkennbar aufgrund des korrigierten doctype) lediglich im IE 6 fehlt die Kennzeichnung, was jedoch verzichtbar erscheint, falls Du nicht noch einen gezielten Tip hättest.
Auf jedenfall herzlichen Dank!
Ralf
- MarkusR
- Handbuchversteher
- Beiträge: 7361
- Registriert: 01.01.1970 01:00
- Hat sich bedankt: 110 Mal
- Danksagung erhalten: 933 Mal
- Kontaktdaten:
Du mußt erst mal Dein CSS in Ordnung bringen!
sollte eher so aussehen
(auf deutsch: Links im Menü sind nicht unterstrichen, weiß und Schriftgröße 10, nur beim Hovern oder wenn der Listeneintrag die Klasse active hat ist die Farbe gelb)
noch als Info
#menu a: ist keine existierende Pseudoklasse
#menu a.link kommt in Deinem Menü nicht vor
#menu li:active a existiert auch nicht, da li's keine Pseudoklasse active haben können
(immer schön auf die Verwendung von Punkt ODER Doppelpunkt achten...)
Code: Alles auswählen
#menu a: {text-decoration:none;color:#fff; font-size:10pt;}
#menu a.link{text-decoration:none;color:#fff;font-size:10pt;}
#menu a:visited{text-decoration:none; color:#fff; font-size:10pt;}
#menu a:hover{color:#fbd618;}
#menu li:active a, #menu li.active a {color:#fbd618;}
Code: Alles auswählen
#menu a {text-decoration:none;color:#fff; font-size:10pt;}
#menu a:hover, #menu li.active a {color:#fbd618;}
noch als Info
#menu a: ist keine existierende Pseudoklasse
#menu a.link kommt in Deinem Menü nicht vor
#menu li:active a existiert auch nicht, da li's keine Pseudoklasse active haben können
(immer schön auf die Verwendung von Punkt ODER Doppelpunkt achten...)
Ciao Markus
ConPresso-Module
Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!
Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
ConPresso-Module
Kein Support per PN!!! Für Fragen und Diskussionen ist das Forum da!
Succi recentis officinalis
Hochwertige Kräutersäfte und -Öle
-
- ConPresso-User
- Beiträge: 34
- Registriert: 31.08.2005 16:46
- Wohnort: Uedem (Kreis Kleve)
- Danksagung erhalten: 1 Mal
Jetzt funktioniert es
Danke,
habe wie geschrieben den Wildwuchs (da hatte ich es wohl zu gut gemeint)beseitigt und nun klappt es tatsächlich auch im IE 6!
Inhaltlich sind mir zwar noch nicht alle Unterschiede so ganz klar, aber vielleicht kommt das ja noch in den nächsten Jahren.......
Ralf
habe wie geschrieben den Wildwuchs (da hatte ich es wohl zu gut gemeint)beseitigt und nun klappt es tatsächlich auch im IE 6!
Inhaltlich sind mir zwar noch nicht alle Unterschiede so ganz klar, aber vielleicht kommt das ja noch in den nächsten Jahren.......
Ralf
- baluo
- ConPresso-Experte
- Beiträge: 607
- Registriert: 14.11.2005 12:17
- Hat sich bedankt: 216 Mal
- Danksagung erhalten: 11 Mal
Ich schlage mich mit einem aehnlichen Problem herum:
Wie kann ich in der Navigation *nur* den derzeit "aktiven" link per css kennzeichnen, auch wenn er sich in einer Unter- oder Unter-Unter-Ebene befindet ?
Beispiel: http://cpo.neulandhalle.de/de/index.php?rubric=test
Der von cpo generierte Quelltext weisst den li-Elementen auf allen drei Ebenen die classe=active zu. Ich braeuchte sie aber nur fuer die jeweils aktive Rubrik:
Die bisherige css:
danke, Gerhard
Wie kann ich in der Navigation *nur* den derzeit "aktiven" link per css kennzeichnen, auch wenn er sich in einer Unter- oder Unter-Unter-Ebene befindet ?
Beispiel: http://cpo.neulandhalle.de/de/index.php?rubric=test
Der von cpo generierte Quelltext weisst den li-Elementen auf allen drei Ebenen die classe=active zu. Ich braeuchte sie aber nur fuer die jeweils aktive Rubrik:
Code: Alles auswählen
<div id="navigation">
<ul>
...
<li><a href="../de/index.php?rubric=aktuelles">Aktuelles</a></li>
<li class="active"><a href="../mod_contact/index.php?rubric=schreiben">Schreiben Sie uns!</a>
<ul>
<li class="active"><a href="../de/index.php?rubric=meinung">Ihre Meinung</a>
<ul>
<li class="active"><a href="../de/index.php?rubric=test">test</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="../de/index.php?rubric=weg">Ihr Weg zu uns</a></li>
...
</ul>
</div>
Code: Alles auswählen
/* beginn navigation */
#navigation ul
{
margin:25px 5px 0 5px; padding:0;
list-style: none;
}
#navigation ul ul,
#navigation ul ul ul
{
margin:0 2px 0 2px; padding:0;
list-style: none;
}
#navigation ul a,
#navigation ul ul a,
#navigation ul ul ul a
{
display: block;
margin:0 0 4px 0; padding: 0 2px 0 0;
text-decoration: none;
list-style: none;
border:1px solid #cccfe4;
font-family:Arial, Helvetica, sans-serif;
font-weight:normal;
font-size:0.9em;
color:#fefefe; background-color:inherit;
text-align:right;
}
/* aktiver Link */
#navigation li.active a
{ color: white; background-color:#cccfe4; }
/* hover Link */
#navigation ul li a:hover,
#navigation ul li ul li a:hover,
#navigation ul li ul li ul li a:hover
{ color: white; background-color:#cccfe4; }
/* ende navigation */
- Mr. Magpie
- ConPresso-Profi
- Beiträge: 1004
- Registriert: 01.01.1970 01:00
- Wohnort: Wuppertal
- Hat sich bedankt: 274 Mal
- Danksagung erhalten: 59 Mal