Вопросы Теги

Ширина столбца таблицы, столь же узкая как содержавшие данные?

У меня есть три столбца. Последние два, которые я хочу сделать столь же узким как их содержавшие данные и первый столбец, могут взять остальную часть ширины (таблица имеет 100% шириной).

Как можно сделать это использование CSS? Прямо сейчас столбцы на правильном взгляде, глупом с дополнительным пространством. Идеи?

8
задан Brian Tompsett - 汤莱恩 28 May 2017 в 15:12
поделиться

1 ответ

Просто задайте первому столбцу ширину из 100% и, при необходимости, укажите ячейки во всех остальных столбцах a white-space: nowrap , чтобы избежать переноса их содержимого (опять же, только при необходимости).

Например. 

<table>
    <tr><td class="first">first</td><td>second</td><td>third</td></tr>
    <tr><td class="first">first</td><td>second</td><td>third</td></tr>
    <tr><td class="first">first</td><td>second</td><td>third</td></tr>
</table>

с 

table { width: 100%; }
table td.first { width: 100%; }

Или современный способ, если вас не беспокоят пользователи IE6: 

table { width: 100%; }
table td:first-child { width: 100%; }

(чтобы вы могли удалить class = "first" )

12
ответ дан 5 December 2019 в 12:57
поделиться