nicht angemeldet
Tabelle zentrieren
Kai345Hi,
ich hab folgendes Problem: Ich will eine Tabelle auf der Seite zentrieren - eine einfache Sache würde man denken, doch im Firefox funktioniert es nicht wie es soll, die Tabelle bleibt linksbündig.
Ich frage mich woran es liegt, eigentlich sollte das doch ganz einfach sein:
CSS:
body {
text-align: center;
}
#wrapper {
margin: 0px auto 0px auto;
}
#header {
text-align: center;
}
#header table {
margin-left: auto;
margin-right: auto;
}
HTML:
<div id="wrapper">
<div class="header">
<table border="1" cellpadding="0" cellspacing="0">
<tr>
<td>as<br />as<br />as<br />as<br />as<br /></td>
</tr>
</table>
</div>
</div>
funktioniert einfach nicht :(. Weiß jemand Rat?
-
Ich verstehe eigentlich nicht, warum du divs und tables benutzt, ist doch einfacher alles mit divs zu machen. Für das zentrieren würde ich:
<table align="center">
empfehlen.
-
Ich verstehe eigentlich nicht, warum du divs und tables benutzt, ist doch einfacher alles mit divs zu machen. Für das zentrieren würde ich:
<table align="center">
empfehlen.
Ja das mit dem Table mach ich wegen geringer bug-anfälligkeit (ist für n Blog-Layout und meiner Erfahrung nach treten immer die komischsten Fehler bei unterschiedlichem Inhalt auf), aber ich glaub ich werd's auch rauskicken... .
Das align="center" funktioniert aber, danke auf jeden Fall!
-
-
Grütze .. äh ... Grüße!
[...] die Tabelle bleibt linksbündig.
Sollte sie sie auch, denn:
#header {
text-align: center;^^^^
ein <div> ist nun mal ein Blockelement und kein Text.
(table align="center" funktioniert zwar auch, ist aber nicht mehr unbedingt zeitgemäß (Trennung von Inhalt und Design))
Außerdem: Wenn außer der Tabelle nichts weiter in diesem <div id="header"> steht, kann das div auch entfallen und die Tabelle direkt die id "header" erhalten.
Cü
Kai--
Der vertuschte Gefahrstoff: Dihydrogenmonoxid
ie:{ fl:( br:< va:) ls:? fo:| rl:? n4:° ss:{ de:] js:| ch:? mo:| zu:|-
Hallo,
Sollte sie sie auch, denn:
#header {
text-align: center;
^^^^Das ist der Fallback für quirksige und alte IEs.
Die Antwort findet sich auch in Stephans Code:
#header table {
margin-left: auto;
margin-right: auto;
}Nur mit dem kleinen Problem, daß der Selektor nicht zutrifft. Viele Grüße Carsten -- [Doctype-Switch? Quirks Mode? Standards Mode? Was is'n das?](http://carsten-protsch.de/zwischennetz/doctype/)-
Grütze .. äh ... Grüße!
Sollte sie sie auch, denn:
#header {
text-align: center;
^^^^Das ist der Fallback für quirksige und alte IEs.
Das ist klar. Was ich damit sagen wollte: Browser, die _nicht_ von irgendwelchen Spacken geschrieben wurden, welche meinen, auf nicht-selbsterfundene Standards scheißen zu können, nur weil sie einem riesigen Softwarekonzern angehören, beachten in der Regel bereits dieses äußere text-align nicht und somit ist schon das die Tabelle umgebende Block-Element <div> linksbündig, womit die innenliegende Tabelle dann auch ohne textfluß-brechende Maßnahmen nicht mehr in die Mitte gesetzt werden kann.
Die Antwort findet sich auch in Stephans Code:
#header table {
margin-left: auto;
margin-right: auto;
}> Nur mit dem kleinen Problem, daß der Selektor nicht zutrifft. Das sollte er sich aber mit Hilfe des kleinen Hinweises zu TEXT-align und der markierung selber erarbeiten ;) Cü Kai -- [Der vertuschte Gefahrstoff: Dihydrogenmonoxid](http://www.dhmo.de/fakten.html) ie:{ fl:( br:< va:) ls:? fo:| rl:? n4:° ss:{ de:] js:| ch:? mo:| zu:|-
Hallo Kai,
Das sollte er sich aber mit Hilfe des kleinen Hinweises zu TEXT-align und der markierung selber erarbeiten ;)
Vielleicht habe ich Deine Antwort mißverstanden, aber mir ist nicht klar, was sich Stephan anhand des Hinweises zu text-align und zu den FAQs noch hätte erarbeiten können.
Stephan hat mit dem Code aus seiner Frage gezeigt, daß er prinzipiell bereits weiß, wie man Block-Elemente sowohl in richtigen Browsern als auch in veralteten Browsern horizontal zentriert. Wenn ich Stephans Frage gestellt hätte und dann Deine Antwort bekommen hätte, hätte ich den Schluß gezogen, daß ich einen schwerwiegenden prinzipiellen Fehler gemacht hätte. Die Verwendung einer Klasse im HTML-Code und eines ID-Selektors im CSS-Code läuft bei mir aber eher unter der Rubrik "Unaufmerksamkeit".
Browser, die _nicht_ von irgendwelchen Spacken geschrieben wurden, welche meinen, auf nicht-selbsterfundene Standards scheißen zu können, nur weil sie einem riesigen Softwarekonzern angehören, beachten in der Regel bereits dieses äußere text-align nicht und somit ist schon das die Tabelle umgebende Block-Element <div> linksbündig, womit die innenliegende Tabelle dann auch ohne textfluß-brechende Maßnahmen nicht mehr in die Mitte gesetzt werden kann.
Diesen Absatz verstehe ich nicht. Das text-align hat in richtigen Browsern keinerlei Auswirkung auf die Ausrichtung der Block-Elemente selbst. Wieso sollte dadurch also die standardkonforme Ausrichtung über margin:auto verhindert werden?
Viele Grüße
CarstenPS:
*breitgrins*
-
-
-
-
Hallo,
#header table {
margin-left: auto;
margin-right: auto;
}Du sprichst also eine Tabelle innerhalb eines Elementes mit der ID "header" an. > ~~~html <div id="wrapper"> > > <div class="header"> > <table border="1" cellpadding="0" cellspacing="0"> > <tr> > <td>as<br />as<br />as<br />as<br />as<br /></td> > </tr> > </table> > </div> > > </div>Ich sehe in Deinem Code aber kein Element mit der ID "header" ... ;-)
Viele Grüße
Carsten