Πώς να κεντρώσεις έναν πίνακα

Μάθετε πώς να κεντρώσετε έναν πίνακα χρησιμοποιώντας το CSS.

Κεντρωμένος πίνακας:

Firstname Lastname Age
Jill Smith 50
Eve Jackson 94
John Doe 80

Πώς να κεντρώσεις έναν πίνακα

Βήμα 1 - Προσθήκη HTML:

<table class="center">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
</table>

Βήμα 2 - Προσθήκη CSS:

Για να τοποθετήσεις το πίνακα στο κέντρο, ρύθμησε τις αποστάσεις των πλευρών σε αυτόματα:

.center {
  margin-left: auto;
  margin-right: auto;
{}

Προσπάθησε το εαυτό σου

Παρακαλώ σημειώστε ότι αν η πλάτος οριστεί στο 100% (πλήρες πλάτος), το ταμπλό δεν μπορεί να κεντρωθεί.

Σχετικές σελίδες

Οδηγίες:Ταμπλό CSS