2010-12-02 5 views
1

Diese html:Warum wird ein Align-Attribut von td nur an eine in IE enthaltene Tabelle weitergegeben?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head><title>TD align test</title></head> 
<body> 
<table width="100%"> 
    <tr><td>aligned left</td><td align="right">aligned right</td></tr> 
    <tr><td colspan="2" align="center"> 
    <table width="100%" cellspacing="0" cellpadding="0"> 
     <tr><td>should be aligned left</td></tr> 
    </table> 
    </td></tr> 
</table> 
</body> 
</html> 

richtet die in IE (6 & 8) und Opera, sondern nach links in Firefox (3.6 & 4 beta) und Chromium zentriert "sollte links ausgerichtet werden". Ersteres scheint die Ausrichtung von der td zur enthaltenen Tabelle zu propagieren.

Kann jemand diesen Unterschied erklären? Und welches Verhalten ist standardkonformer?

(Sie können ihn unter http://ysth.info/tdalign.html versuchen.)

+0

Ist dies nur eine Fallstudie? weil Sie den Mittelpunkt nicht ausrichten müssen, wenn der Inhalt 100% breit ist. Aber das Thema ist in der Tat interessant. –

+0

@Gaby: Ja, das ist nur ein einfacher Fall, der den Effekt demonstriert. Ich würde gerne die Kräfte kennenlernen, die hier im Spiel sind, um es zu ermöglichen, alle ähnlichen Probleme in einem großen, tabellenfreudigen Code zu finden, nicht nur die offensichtlichen Probleme. – ysth

Antwort

1

Sie können sehen http://www.docsteve.com/DocSteve/TechNotes/IE6_cascade_test.html für warum es könnte passieren.

Tatsache ist, dass es eine andere IE Glitch ist (Unverträglichkeit mit anderen Browsern). Ich kann nur vorschlagen, es zu überschreiben, indem Sie ausdrücklich die Ausrichtung angeben, die Sie wollen.

Wenn Sie Klassen und text-align:center verwenden, werden Sie feststellen, dass alle Browser so verhalten wie IE mit dem align Attribut, also nicht sicher, welches ist richtig/falsch damit.

+0

Hmm. wäre 'table {text-align: left}' eine generische Korrektur? (Ich habe keine th Elemente) – ysth

+0

@ysth, ja, aber kombiniert mit 'td {text-align: inherit;}', sollte es alle Fälle abdecken. Aber Sie müssen ein 'class' oder das' style' Attribut verwenden, um es zu überschreiben, da das 'align =" left "' nicht funktioniert (* es wird von diesen Regeln überschrieben *) –

+0

Ich habe diesen letzten Teil nicht bekommen ; Kannst du das klären, vielleicht mit einem Beispiel? – ysth

1

Das Attribut align ist deprecated, also auch wenn ich weiß, wie es zu verwalten, würde ich nicht wohl fühlen, versuchen, es zu verhandeln als neuerer Browser mehr haben kann, und mehr Probleme, es konsequent anzuzeigen.

Für Ihren Fall können Sie nur wollen, Klassen definieren .right und .left (Cascading .right außer Kraft zu setzen) und sie auf die Zeilen, Tabellen oder Zellen heften, wie Sie für richtig halten.

+0

veraltet sollte kein Problem sein; Deprecated bedeutet nur, dass Benutzeragenten, die nur zukünftige HTML-Versionen unterstützen, es möglicherweise nicht mehr unterstützen, es bedeutet * nicht *, dass Benutzeragenten, die vorgeben, 4.01 zu unterstützen, Carte Blanche haben, um veraltete Dinge zu brechen. Das heißt, der html5-Entwurf entfernt align, und allein die Tatsache, dass er veraltet ist, weist darauf hin, dass es gute Gründe gibt, ihn nicht zu verwenden. – ysth