چگونه جدول را در وسط قرار دهیم

چگونه جدول را در وسط قرار دهیم

مرحله اول - اضافه کردن 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>

مرحله دوم - اضافه کردن CSS:

جداول را در وسط قرار دهید تا حاشیه‌های چپ و راست به صورت خودکار تنظیم شوند:

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

کوشش کنید خودتان

لطفاً توجه داشته باشید که اگر عرض تنظيم شده به 100% (تمام‌عرض) باشد، جداول نمی‌توانند در وسط قرار گيرند.

صفحات مرتبط

آموزش:جداول CSS