Как сделать выравнивание по центру в таблице в css?

Пользователь

от clement.erdman , в категории: HTML/CSS , 2 года назад

Как сделать выравнивание по центру в таблице в css?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от kendall_mckenzie , 2 года назад

@clement.erdman Сделать выравнивание по центру в таблице в CSS если это текст, то можно через text-align :


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<head>
<style>
      table,
      th,
      td {
        border: 2px solid brown;
        text-align: center;
      }
    </style>
  </head>
  <table style="margin: auto">
    <tr>
      <th>Животное</th>
      <th>Возраст</th>
    </tr>
    <tr>
      <td>Кошка</td>
      <td>5</td>
    </tr>
    <tr>
      <td>Собака</td>
      <td>7</td>
    </tr>
  </table>

Пользователь

от brenna , год назад

@clement.erdman 

Для выравнивания содержимого ячейки таблицы по центру в CSS можно использовать свойство text-align: center;. Например:

1
2
3
td {
  text-align: center;
}


Это свойство будет применяться ко всем ячейкам таблицы. Если вам нужно выровнять только определенные ячейки, вы можете использовать класс или id этих ячеек в качестве селектора.

1
2
3
td.center {
  text-align: center;
}


1
2
3
#my-center-cell {
  text-align: center;
}


И использовать их в html

1
<td class="center"> ... </td>


1
<td id="my-center-cell"> ... </td>