e7: IE 6 zeigt keine Hintergrundfarbe an...

Hi,

ich bin am verzweifeln... Versuche gerade ne Seite im IE 6 anzeigbar zu machen (IE 5 hab ich vorerst mal aufgegeben, da wird das höchstwahrscheinlich nix mehr)... Jetzt versemmelt der mir schon das einfachste CSS... Bei komplexen CSS mit irgendwelchen exotischeren Eigenschaften bin ich ja gewohnt Workarrounds drumzubasteln... Aber hier ist der Fall so simpel, da fällt mir nix ein ;)

Hier erst mal die stark vereinfachte *g* Version der Seite:

<html><head><title>Test</title>
<style type="text/css">

#div2.a { background-color: #a00; }
#div2.b { background-color: #0a0; }
#div2.c { background-color: #00a; }

</style>
</head><body>

<div id="div2" class="c">
 Text hier m&uuml;sste dunkelblau hinterlegt sein
</div>
<div id="div2" class="a">
 Text hier m&uuml;sste weinrot hinterlegt sein
</div>

</body></html>

Seite online anschauen

Das macht sogar der IE 5.0 richtig... Aber mein IE 6.0.2900.2180 weigert sich standhaft, die Zeile dunkelblau zu hinterlegen...

Allerdings, wenn ich dann die Zeile mit #div2.c nach oben verschiebe klappt's:

#div2.c { background-color: #00a; }
#div2.a { background-color: #a00; }
#div2.b { background-color: #0a0; }

Wieder online

Dafür sind dann a und b nicht mehr wirksam...

Hier mal ein Bild von der ersten Variante:

Ach ja, auf der richtigen Seite ist das dann mit background-image, aber ist genau das gleiche Verhalten...

Kennt einer von euch zufällig das Phänomen? Und hat zufällig nen Workarround oder so was? Tritt das überhaupt bei euch auf (IE6-only)?

e7

  1. Hallo,

    Hier erst mal die stark vereinfachte *g* Version der Seite:

    <html><head><title>Test</title>
    <style type="text/css">

    #div2.a { background-color: #a00; }
    #div2.b { background-color: #0a0; }
    #div2.c { background-color: #00a; }

    </style>
    </head><body>

    <div id="div2" class="c">
    Text hier m&uuml;sste dunkelblau hinterlegt sein
    </div>
    <div id="div2" class="a">
    Text hier m&uuml;sste weinrot hinterlegt sein
    </div>

    </body></html>

    Hier darf er das sogar, weil eine ID in einem Dokument _eindeutig_, lies: einmalig, zu sein hat, also nur _ein_ Element mit dieser ID existieren darf.

    IE macht das aber auch dann so, wenn das CSS für mehrere Dokumente gilt und dann ist es falsch. Eine Lösung, außer mehrere CSS-Definitionen für eine ID zu vermeiden, gibt es soweit ich weiß nicht.

    viele Grüße

    Axel

    1. Hallo,

      IE macht das aber auch dann so, wenn das CSS für mehrere Dokumente gilt und dann ist es falsch. Eine Lösung, außer mehrere CSS-Definitionen für eine ID zu vermeiden, gibt es soweit ich weiß nicht.

      Siehe auch hier: http://forum.de.selfhtml.org/archiv/2006/6/t131477/#m850513

      viele Grüße

      Axel

    2. Hi,

      Hier darf er das sogar, weil eine ID in einem Dokument _eindeutig_, lies: einmalig, zu sein hat, also nur _ein_ Element mit dieser ID existieren darf.

      daran liegt's nicht... Ich hab auf die schnelle einfach den Block noch mal drunterkopiert und die Klasse ausgetauscht, dass man das auch auf den ersten Blick sofort sehen kann...

      Das Problem tritt unabhängig von doppelter ID/nicht doppelter ID auf. Dass eine ID nicht zweimal auftauchen darf ist mir klar, ist nur durch das Beispiel-Schreiben-und-Vereinfachen hier aufgetreten...

      e7

  2. Hallo e7,

    <div id="div2" class="c">
    <div id="div2" class="a">

    zweimal die selbe ID in einem Dokument ist afaik auch mit unterschiedlichen Klassen  nicht zulässing oder passiert dies unabhängig von diesem Fehler?

    Mit freundlichem Gruß
    Micha

    --
    LeagueEditor JavaScript kostenlose Ligaverwaltung || richtig Messen will gelernt sein
  3. Versuchs mal so:

    div#a { background-color: #a00; }
    div#b { background-color: #0a0; }
    div#c { background-color: #00a; }

    ...

    <div id="c">
    Text hier m&uuml;sste dunkelblau hinterlegt sein
    </div>
    <div id="a">
    Text hier m&uuml;sste weinrot hinterlegt sein
    </div>

    ...

    1. Hi,

      div#a { background-color: #a00; }
      div#b { background-color: #0a0; }
      div#c { background-color: #00a; }

      gute Idee - aber leider hat das div schon eine ID, deshalb die Klasse... Und die ist je nach Seite immer verschieden, während die ID gleich bleibt :(

      E7