Ich möchte eine Tabelle mit fester Breite in der Mitte des Browser-Fensters anzeigen. Jetzt benutze ichCSS Weg zum horizontalen Ausrichten der Tabelle
<table width="200" align="center">
Aber Visual Studio 2008 gibt auf dieser Linie Warnung:
Attribut 'align' veraltet betrachtet. Ein neueres Konstrukt wird empfohlen.
Welchen CSS-Stil sollte ich auf die Tabelle anwenden, um dasselbe Layout zu erhalten?
Steven richtig ist, in theory:
der "richtige" Weg, um eine Tabelle mit zu zentrieren CSS. Übereinstimmende Browser sollten Tabellen zentrieren, wenn der linke und der rechte Rand gleich sind. Der einfachste Weg dies zu tun ist, um die linken und rechten Rand setzen So könnte man in einem Stylesheet schreiben „auto.“:
table
{
margin-left: auto;
margin-right: auto;
}
Aber der Artikel am Anfang dieser Antwort erwähnt gibt Ihnen all die andere Art, einen Tisch zu zentrieren.
Eine elegante css Cross-Browser-Lösung: Dies sowohl in MSIE 6 arbeitet (Quirks und Standards), Mozilla, Opera und Netscape 4.x auch ohne explizite Breiten einstellen:
div.centered
{
text-align: center;
}
div.centered table
{
margin: 0 auto;
text-align: left;
}
<div class="centered">
<table>
…
</table>
</div>
Und danke für den Artikellink! –
Sie können die Tabelle mit dem Rand zentrieren: 0 auto; in IE6 und höher, wenn Sie sicherstellen, dass Ihre Seite eine gültige Doctype-Deklaration hat. –
@Marco: Ich habe nicht gerade jetzt diese Informationen, aber das kann eine gute Basis für eine Frage zu StackOverflow sein. – VonC
style="text-align:center;"
(glaube ich)
oder Sie können es einfach ignorieren, es funktioniert immer noch
Try this:
<table width="200" style="margin-left:auto;margin-right:auto">
Dies sollte funktionieren:
<div style="text-align:center;">
<table style="margin: 0 auto;">
<!-- table markup here. -->
</table>
</div>
Einfach. IE6 und höher werden Ihre Tabelle gerne mit "margin: 0 auto;" wenn nur die Seite im "Standards" -Modus gerendert wird. Um dies ermöglichen müssen Sie eine gültige DOCTYPE-Deklaration, wie
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
oder
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Es stimmt, IE5.5 und unten wird weiterhin die Tabelle verweigern zu zentrieren, aber vielleicht kann man damit leben, vor allem, wenn die Seite noch funktionsfähig ist und die Tabelle linksbündig ausgerichtet ist. Ich denke, mittlerweile sind Benutzer von IE5.5 und darunter ziemlich an etwas seltsam aussehende Webseiten gewöhnt - aber Sie müssen trotzdem sicherstellen, dass diese visuellen Störungen Ihre Website nicht unbrauchbar machen.
Glückliche Codierung!
EDIT: Entschuldigung, ich sollte vielleicht darauf hinweisen, dass Sie nicht einen "strikten" Doctype haben müssen, um IE6 und in den "Standards" -Rendering-Modus zu bekommen. Ich erkannte, dass es von den oben beschriebenen Doctype-Beispielen so aussehen könnte.Zum Beispiel wird diese Doctype Deklaration natürlich ebenso arbeiten:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Ich lerne gerade das und was für mich schließlich arbeitete, war zunächst eine Tabelle mit drei Zeilen zu machen. Setzen Sie den Rand für die linke und rechte Reihe auf 50%. Fügen Sie dann eine einzelne Zeile mit fester Breite in die "Tabellendaten" der mittleren "Tabellenzeile" ein.
<style>
.abc {
text-align: center;
}
</style>
<table class="abc">
<tr>
<td>Item1</td>
<td>Item2</td>
</tr>
</table>
Obwohl es in der heutigen Welt vielleicht Häresie sein könnte - in der Vergangenheit würden Sie den folgenden Nicht-CSS-Code machen. Dies funktioniert in allem bis einschließlich dem heutigen Browser aber - wie gesagt - es ist Ketzerei in der heutigen Welt:
<center>
<table>
...
</table>
</center>
Was Sie brauchen, ist eine Art und Weise zu sagen, dass Sie eine Tabelle zentrieren möchten und die Person ist Verwenden eines älteren Browsers. Fügen Sie dann die Befehle "< center>" um die Tabelle ein. Ansonsten - benutze CSS.
Überraschenderweise - wenn man alles im Körperbereich zentrieren möchten - Sie können nur den Standard-Befehl
text-align: center;
CSS verwenden und in IE8 (mindestens) wird es alles auf der Seite inklusive Tabellen zentrieren.
Also, welche Lösung haben Sie am Ende gewählt? –