语义界面表如何使右列在水平滚动时固定

<div class="table-container">
  <table>
    <thead>
      <tr>
        <th>列1</th>
        <th>列2</th>
        <th>列3</th>
        <th>列4</th>
        <th>列5</th>
        <th>列6</th>
        <th>列7</th>
        <th>列8</th>
        <th>列9</th>
        <th>列10</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>内容1</td>
        <td>内容2</td>
        <td>内容3</td>
        <td>内容4</td>
        <td>内容5</td>
        <td>内容6</td>
        <td>内容7</td>
        <td>内容8</td>
        <td>内容9</td>
        <td>内容10</td>
      </tr>
      <!-- 其他行 -->
    </tbody>
  </table>
</div>

.table-container {
  width: 100%;
  height: 300px;
  overflow: auto;
}

.table-container th:nth-child(10),
.table-container td:nth-child(10) {
  position: sticky;
  right: 0;
  background-color: #fff; /* 可选，用于遮盖固定列的内容 */
}