Как сделать таблицу, которая шире, чем размер экрана, прокручивать и сохранять фиксированную строку заголовка?

У меня естьТаблица с 2 столбцами, и каждый столбец имеет ширину 800 пикселей. Я хочу показать эту таблицу в окне 800x50. Поэтому должна быть горизонтальная и вертикальная полоса прокрутки для просмотра полной таблицы.

Пока я нашел несколько похожих решений (этот а такжеэтот) на SO они работают, только если ширина таблицы меньше размера экрана. В моем случае размер экрана составляет 1200 пикселей, а общая ширина таблицы - 1600 пикселей.

Как я мог это сделать? я хочу достичь чего-то вродеэтот.

РЕДАКТИРОВАТЬ К сожалению, я забыл добавить еще одно требование. Сожалею. Я хочу, чтобы заголовок таблицы оставался фиксированным, пока пользователь прокручивает таблицу.

EDIT2

Я попробовал описанные ниже решения, чтобы обернуть в div, но в этом случае вертикальная полоса прокрутки не отображается. Посмотри пожалуйстаэтот стол с оберткой Кажется, эта проблема возникает, только если ширина таблицы больше, чем размер экрана. Я тестирую на FF3.6.

EDIT3

токТаблица код. Это не имеет вертикальной прокрутки, хотя я могу прокручивать по вертикали.

<div style="overflow:scroll; width:800px;height:50px" >
<table style="width:1600px" border="1">
  <thead>
    <tr>
        <th style="width:800px">id_1</th>
        <th style="width:800px">id_1</th>
    </tr>
  </thead>
  <tbody style="">
    <tr><td>1200</td><td>1200</td></tr>
    <tr><td>1200</td><td>1200</td></tr>
    <tr><td>1200</td><td>1200</td></tr>
    <tr><td>1200</td><td>1200</td></tr>
    <tr><td>1200</td><td>1200</td></tr>
    <tr><td>1200</td><td>1200</td></tr>
  </tbody>
</table>
</div>

Ответы на вопрос(5)

Ваш ответ на вопрос