CSS background-color auf dem Tisch td falsch in Internet Explorer 6 Anzeigen

StackOverflow https://stackoverflow.com/questions/2014353

Frage

Ich habe einige ziemlich einfache HTML und CSS, die nicht in Internet Explorer 6 nicht funktioniert. 

<!DOCTYPE HTML>
<html>
    <head>
        <style>        
            table td.one.read {background-color:#FFD700;}
            table td.two.read {background-color:#0000ff;}
            table td.three.read {background-color:#ff8c00;}
        </style>
    </head>

    <body>
        <table>
            <tr class="head">
                <td></td>
                <td class='one read'>one</td>
                <td class='two read'>two</td>
                <td class='three read'>three</td>
            </tr>

            <tr>
                <td>Legend</td>
                <td class='one read'>1</td>
                <td class='two read'>2</td>
                <td class='three read'>3</td>
            </tr>
        </table>
    </body>
</html>

Eine einfache Tabelle, die unterschiedlichen Hintergrundfarben für jede Spalte hat. Ich habe eine Reihe von anderen CSS / HTML entfernt Dinge einfach zu halten. Das Problem ist, alle Spalten zeigen, wie die gleiche orange Farbe in Internet Explorer 6, arbeitet in Firefox .

Wie kann ich es?

War es hilfreich?

Lösung

Dies ist ein Fehler im IE6.

Wenn Sie einen CSS-Selektor mit mehreren Klassennamen haben (zB .three.read), IE6 werden alle Klassennamen mit Ausnahme des letzten ignorieren.

Daher IE6 sieht drei CSS-Regeln für den Wähler table td.read.

Um dies zu lösen, können Sie Ihre Klassen kombinieren. (ZB <td class='OneRead'> und table td.OneRead {background-color:#FFD700;})

Andere Tipps

Mehrere Klassen werden nicht in IE6 unterstützt, müssen noch ein paar Jahre warten, bevor IE6 stirbt. obwohl jetzt können Sie separate Klassen für Farben erstellen.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top