Это лучший способ, чтобы свернуть ширину столбца?


Требования:
Когда страница (или в случае примера кадр) расширяется, только колонки расширить с таблицей должны быть "разморожена" столбцов (без "заморозить" класс).

вот демо - версия jQuery есть, чтобы показать динамический контент, это не код в комментарий

Что мне действительно не нравится-это то, что кажется суховато, чтобы просто установить ширину столбца до 1px... я могу предвидеть это вызывает проблемы со старыми браузерами/junkier.

HTML-код

<!-- snippet -->
    <thead>
        <tr>
            <th class="freeze">id</th>
            <th class="freeze">name</th>
            <th>description</th>
            <th class="freeze">something else</th>
            <th class="freeze">actions</th>
        </tr>
    </thead>

УСБ

.data-table {
    width: 100%;
    font-size: 90%;
    background-color: #fff;
    border: 1px solid #666;
}
.data-table th {
    white-space: nowrap;
    text-align: center;
}
.data-table td {
    font-size: 90%;
    color: #222;   
}
.data-table td:last-child {
    white-space: nowrap;
}
.data-table td, .data-table th {
    padding: 6px;
    border-right: 1px solid #999;
}
.data-table td:last-child, .data-table th:last-child {
    border: none; 
}
.data-table tbody tr {
    border: 1px solid #666; 
}
.data-table tbody tr:nth-child(odd) td {
    background-color: #efefef;
}
.freeze {
    width: 1px;   
}

Это работает, по крайней мере, ИЕ8, хром 16, и FF8



5678
3
задан 22 декабря 2011 в 02:12 Источник Поделиться
Комментарии
1 ответ

ИМХО это совершенно нормально, чтобы задать ширину, как это. Ячейки таблицы Ширин всегда быть определена как "минимальная ширина".

Как долго стол не стол-макет: фиксированная или клетки нет переполнения установлен во что-то, чем видимый, я не верю, что любой браузер (старый или новый) будет иметь никаких проблем ширина.

Единственные нарекания я бы, получается, что размер в 1px чувствует себя неправильно для меня, в основном, потому что это заставляет колонку для того чтобы обернуть как можно больше и в зависимости от содержания, это может выглядеть не очень хорошо. Я бы предложил 1эм (чисто потому что он "чувствует себя" лучше :-) а может и больше, минимальная ширина такие, как 10им бы быть пригодны для некоторых столбцов.

4
ответ дан 22 декабря 2011 в 03:12 Источник Поделиться