Таблица и скролл группы td?

Question

[Анна Бакурова]

Как сделать так чтобы часть страницы скроллилось? В интернете нашла только ответы на то как чтобы tbody скроллилось, но это и ежу понятно, а тут выходит что td с определенной группой скроллятся. И так такое валидно сделать не знаю. Вариант а iframe отпадает сразу

Answer 1

[Dimitriy]

На счет кросса не уверен, последние FF, Chrome и IE8+ работают

.wrap{
        position: relative;
    }
    .wrap-scroll{
        margin-left: 100px;
        width: 300px;
        overflow: auto;
    }
    table{
        width: 500px;
    }
    table td{
        width: 100px;
        border: 1px solid #ccc;
    }
    table tr td:first-child{
        width: 100px;
        position: absolute;
        left: 0px;
        z-index: 100;
    }

<div class="wrap">
    <div class="wrap-scroll">
        <table>
            <tbody>
                <tr>
                    <td>Col-1</td>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                </tr>
                <tr>
                    <td>Col-2</td>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

Comments

[Анна Бакурова]

Отлично! Спасибо большое. Кроссбраузерность будет +ie8 если попыжиться с z-index то и 7 можно сделать )

[Dimitriy]

Пожалуйста. На счет ие7, как-то не уверен, давно его не проверял :)

[Анна Бакурова]

@Vakiliy можно, у него просто с z-index траблы, но если подшаманить (что мне не нужно) то можно