CSS wird im IE6 nicht beachtet - im Mozilla schon

Computer: Software & Programmierung HTML & CSS
#1

Hallo,
ich habe mir da per CSS eine Text-Navigation gebastelt, die sich beim Darüberfahren mit der Maus verändern soll. Nur irgendwie funktioniert die leider nicht auf meinem Webserver.

Auf dem Weberver wird im IE6 das CSS irgendwie nicht beachtet und der Text nicht formatiert. Die Links dürften nicht unterstrichen sein und beim Darüberfahren müssten sie sich rot färben.

Das Eigenartige ist aber, dass im Mozilla 1.4 alles bestens funktioniert.

Kann es sein, dass ich da irgendwas falsch eingebunden habe. Ich benutze ja verschiedene Effekte für die beiden Navigationsbereiche --> siehe meine Testseite.

http://private.addcom.de/biketours/test.htm

Danke für jeden Tipp.

Gruß
Pfanni

#2

Hallo Pfanni,

Auf dem Weberver wird im IE6 das CSS irgendwie nicht beachtet
und der Text nicht formatiert. Die Links dürften nicht
unterstrichen sein und beim Darüberfahren müssten sie sich rot
färben.

Vielleicht solltes du mal den Cache des Browsers räumen, oder
a.Navi:visited auch text-decoration: none; setzen

Mit Opera 7.11 und MSIE 6.0 schaut’s gleich aus. Wenn man das erste Mal drauf kommt funktioniert meiner Erinnerung nach der Hover-Effekt, danach eben nicht mehr.

Nur so ne Vermutung

eljot

#3

Hallo Pfanni

Willst Du verschiedene hover, dann sollte es so sein:

td.Navi
a:link {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
color: black;
text-decoration: none;
}

td.Navi
a:hover {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
font-weight: normal;
font-variant: normal;
color: red;
}

td.Top
a:hover {
font-family: Arial, Helvetica, sans-serif;
…
…
…
}

Anstelle von td’s kannst Du natürlich auch span’s oder sonst was nehmen.

CU Fr@nkie

The Truth Is Out There … ;o)

#4

Hi,

Willst Du verschiedene hover, dann sollte es so sein:

td.Navi
a:link {
font-family: Arial, Helvetica, sans-serif;

diese Möglichkeit kenne ich gar nicht. Muss ich das in der *.css ändern?
Bisher dachte ich immer, dass ich mehrere verschiedene so definiere:

a.Wunsch1:link{…}
a.Wunsch2:link{…}

also du hast da ja nur jeweils was drübergeschrieben.

Im Moment baue ich das ganze Teil eh neu Schritt für Schritt auf. Mal sehen ob ich dabei über den Fehler/Problem stolpere. Vielleicht könnte ich da deine Idee gut einsetzten

cu
Pfanni

#5

Hi Pfanni

Muss ich das in der *.css ändern?

Jo (oder wenn Du es im head hast, im head).

so …
a.Wunsch1:link{…}
a.Wunsch2:link{…}

Wenn, dann so:
A:link.hoverbeispiel1 {color:#0033CC;text-decoration: none}
A:visited.hoverbeispiel1{color:#0033CC;text-decoration: none}
A:active.hoverbeispiel1 {color:#FF0000;text-decoration: none}
a:hover.hoverbeispiel1{background:#333333;color:white;font-weight:bold;text-decoration:none}

A:link.hoverbeispiel2 {background:004040;color:white; text-decoration:none}
A:visited.hoverbeispiel2 {background:#004040;color: white;text-decoration:none}
A:active.hoverbeispiel2 {color: #FF0000;text-decoration:none }
a:hover.hoverbeispiel2{background:#333333;color:#008080;font-weight:bold;text-decoration:none}

A:link.hoverbeispiel3 {background:#006699;color:white}
A:visited.hoverbeispiel3 {background:#006699;color:white}
A:active.hoverbeispiel3 {color:#FF0000;text-decoration: none}
a:hover.hoverbeispiel3{background:black;color:#0099CC;font-weight:bold}

Also erst link usw. und dann den stylenamen (und das natürlich in der css-Datei).

CU Fr@nkie

The Truth Is Out There … ;o)

#6

Hi Fr@nkie

A:link.hoverbeispiel3 {background:#006699;color:white}

Also erst link usw. und dann den stylenamen (und das natürlich
in der css-Datei).

also laut SelfHTML muss es anders herum geschrieben werden.
Jetzt stellt sich nur noch die Frage ob ich dazu wirklich zwei *.cass Dateien brauche oder ob man das auch in eine packen kann. Muss ich mal etwas mit spielen.

kleiner Auszug:

Wie kann ich für bestimmte Verweise andere als die dateiweiten Verweisfarben definieren?
Das geht mit CSS Stylesheets. Dazu definieren Sie verschiedene zentrale Klassen für Verweise. Das sieht beispielsweise so aus:

<!–
a.type_1:link { color:#FF0000; }
a.type_2:link { color:#FF00FF; }
a.type_1:visited { color:#990000; }
a.type_2:visited { color:#990099; }
a.type_1:active { color:#000000; }
a.type_2:active { color:#000000; }
–>
Dabei sind type_1 und type_2 die Klassennamen. Die Syntax mit den Doppelpunkten ist die für Pseudoformate. In HTML können Sie die verschiedenen Klassen dann mit dem class-Attribut ansprechen:
Verweis
Verweis

Quelle:
http://selfhtml.teamone.de/navigation/faq.htm

Gruß
Pfanni

#7

Hi Pfanni

also laut SelfHTML muss es anders herum geschrieben werden.

Was ich schon Bugs in selfhtml gefunden habe…
Aber selfhtml ist von Menschen geschrieben worden und die machen bekannlicherweise auch Fehler.
Teste einfach mal deren Beispiel und Du wirst sehen es funktioniert nicht, Meins hingegen schon.

Jetzt stellt sich nur noch die Frage ob ich dazu wirklich zwei
*.cass Dateien brauche oder ob man das auch in eine packen kann.

Eine genügt.

CU Fr@nkie

The Truth Is Out There … ;o)

#8

Hi Fr@nkie

Teste einfach mal deren Beispiel und Du wirst sehen es
funktioniert nicht, Meins hingegen schon.

es funktionieren beide Lösungen. Habs eben mal getestet. Mal sehen ob ich irgendwo im Netz die Spezifikationen dazu finde. Mal sehen welche Lösung dann wirklich danach arbeitet.

Gruß
Pfanni