滚动不在HTML表中工作

我正在尝试在的行中添加滚动到我的表，但它似乎不起作用。 以下是我的布局：

---

不能简单地在表行之间粘贴任何DOM元素。 尝试使用t车身：

---

谢谢，td.centerAlign似乎不再有效。这有关系吗？不，这是工作。它将单元格中的文本按中心对齐。尝试设置列宽。

<div align="center">
    <table class="sampleTable">
        <tr>
            <th class="centerAlign" colspan="3">
                <b>HEADER</b>
            </th>
        </tr>
        <tr>
            <th class="centerAlign">COLUMN 1</th>
            <th class="centerAlign">COLUMN 2</th>
            <th class="centerAlign">COLUMN 3</th>
        </tr>
        <tbody class="scroll">
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
            <tr>
                <td class="centerAlign">
                    <a href="google.com">DATA</a>
                </td>
                <td class="centerAlign">
                    DATA
                </td>
                <td class="centerAlign">
                    DATA
                </td>
            </tr>
          </tbody>
      </table>

table.sampleTable {
  border: 0;
  width: 60%;
  height: 90%;
  display: block;
}

td.centerAlign, th.centerAlign {
  text-align: center;
}

tbody.scroll {
  overflow: scroll;
  height: 100px;
  display: block;
}