Равные ячейки таблицы

Как сделать равные ячейки таблицы?

Таблица сделана с помощью Bootstrap'а. Но меня не устраивает, что поле с датой занимает так много места, как сделать эту ячейку меньше или как сделать все ячейки одинакового размера?

Таблица


Ответы (1 шт):

Автор решения: Spartak

В общем случае, один из вариантов - это подробить колонки свойством width на равные части при помощи процентоного соотношения. А вообще, способов много. И на будущее, при подобных вопросах, предоставляйте имеющийся у вас код, который формирует таблицу, а не просто шлите скриншот. Тогда вам точнее смогут помочь и вам будет намного проще применить это решение к своему проекту.

<!DOCTYPE html>
<body>

  <table class="table1" border=1>
    <th>#</th>
    <th>Дата</th>
    <th>Монета</th>
    <th>Кол-во</th>
    <th>Цена</th>

    <tr><td>1</td><td>какая то дата</td><td>BTC</td><td>2.0</td><td>2.0</td></tr>
    <tr><td>2</td><td>еще какая то дата</td><td>ETH</td><td>0.0003</td>27.34</tr>

  </table>

  <style media="screen">
    .table1 {
      width: 100%;
    }
    .table1 th, td {
      width: 20%;
      text-align: left;
    }
  </style>

</body>

→ Ссылка