Как сделать таблицу, которая шире, чем размер экрана, прокручивать и сохранять фиксированную строку заголовка?
У меня естьТаблица с 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>