[CSS:]Zentrieren einer Tabelle

maceis

maceis

Aktives Mitglied
Thread Starter
Dabei seit
24.09.2003
Beiträge
16.880
Reaktionspunkte
626
hallo zusammen,
habe eben festegestellt, dass in Safari weder die konventionelle noch die moderne Methode zum Zentrieren von Blockelementen bei tabellen funktioniert:
Code: 
<head>
    <style>
        div.center {
            text-align: center; 
            margin-left: auto;
            margin-right: auto;
        }       
    </style>
</head>
<body>
    <div class="center">
        <table border=1>
            <tr><td>bla</td></tr>
            <tr><td>fasel</td></tr>
        </table>
    </div>
</body>
Das Ding bleibt links kleben, obwohl es doch in der Mitte sein sollte, oder steh' ich irgendwo auf der Leitung?
 
Gib dem div-container mal eine fixed width...

z.B.: width:300px; oder min-width:300px;
 
Zuletzt bearbeitet:
Eben. Da eine Tabelle ein Blockelement ist wird die doch sonst 100% breit? Da könntest du dir das Div doch fast schon sparen:

<table width="400" border="0" cellspacing="0" cellpadding="0" style="margin: 0px auto;">
<tr>
<td>Test</td>
</tr>
</table>

So in dem Dreh müsste das gehen
 
Zuletzt bearbeitet:
So gehts (auch ohne Breitenangabe, die ich nicht möchte):
Code: 
<head>
    <style>
        div.center {
            text-align: center; 
        }       
        table { 
            margin-left: auto;
            margin-right: auto;
        }       
    </style>
</head>
<body>
    <div class="center">   
        <table border=1>
            <tr><td>bla</td></tr>
            <tr><td>fasel</td></tr>
        </table>
    </div>  
</body>
logisch erscheint mir das aber nicht.
Der Container selbst ist doch auch ein Blockelement :confused:
 
macom500 schrieb:
Das entspricht aber nicht dem DIV-Wahnsinn :D
Zum Vergrößern anklicken....
Du wirst es kaum glauben, aber das div Element ist hier zwingend erforderlich, auch wenn das in meinem vereinfachten Codebeispiel nicht erkennbar ist ;).
 
Ok, wollt ja auch mal so tun als würd ich irgendwie was nützliches kluges zu sagen haben. Hast mich wieder abgeorfeigt ;)

Der Container ist auch ein Blockelement, das ist richtig. Wenn du jetzt aber deinem div keine feste Breite zuweist und deiner table auch nicht haben beide eine Breite von 100%. Und das kann ja nicht zentriert werden. Und in deinem oberen Beispiel hattest du halt keine Breite im Container, darum konnte das nicht zentriert werden.

Wenn du jetzt aber dem Container ne Breite von 300 Pixeln gibst, kann die Tabelle ja nicht breiter werden (die 300 Pixel sind ja dann praktisch die 100% für die Tabelle).

Man könnte das Div auch einfach weglassen, und der Tabelle eine feste breite geben (entweder über width="300" oder style="width: 300px;") und diese dann mit margin: 0px auto; ausstatten, dann wär die auch zentriert, weil du ja die breite vorgibst.
 
abgeohrfeigt?
wieder?

Noch nicht, aber jetzt :D:
Eins ist nämlich falsch, an Deiner Erklärung: Eine Tabelle hat nicht von Haus aus die Breite 100% sondern eine vom Content abhängige Breite.
Ansonsten überzeugt mich Deine erklärung - Danke.
 
Hmm? Ich dachte immer Blockelemente wären so breit wie man ihnen das erlaubt. Nachdem Tabellen Blockelemente sind hab ich eben angenommen, dass die dann auch die maximal verfügbare Breite in Beschlag nehmen. Naja, man lernt nie aus ;)

Danke für die Info und hoffentlich klappts
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben Unten