Как сделать так, чтобы крайний левый столбец соответствовал содержимому вертикальной таблицы?

Есть ли способ сделать самый левый столбец подходящим для его содержимого в вертикальной таблице? Посмотрите на этот скриншот Ожидание: введите здесь описание изображения Актуально: введите здесь описание изображения


vmware-clarity
person Jeonsoft FaceBundy    schedule 15.10.2018    source источник
comment
Можете ли вы показать репродукцию того, что вы имеете в виду? Вы просто используете обычную таблицу? Я предлагаю вам просмотреть этоhttps://stackoverflow.com/questions/26915087/how-to-get-the-td-in-html-tables-to-fit-content-and-let-a-specific-td-fill/ 26915414   -  person Jeremy Wilken    schedule 16.10.2018
comment
@JeremyWilken Нет, это не обычный стол. Это вертикальная таблица в пользовательском интерфейсе Clarity. Что мне нужно, так это сделать так, чтобы столбец меток соответствовал самому длинному тексту во всех строках, а оставшееся пространство растянулось вместе со столбцом значений. Пожалуйста, смотрите отредактированное описание.   -  person Jeonsoft FaceBundy    schedule 18.10.2018
comment
Возможный дубликат Как заставить ‹td› в HTML-таблицах соответствовать содержимому и позволить определенному ‹td› заполнить остальное   -  person gfullam    schedule 27.11.2018

Ответы (1)


arrow_upward
1
arrow_downward

Вот один из способов автоматической подгонки ширины столбцов к их содержимому с помощью css. В элемент th, который вы хотите подогнать под содержимое, добавьте этот класс:

.auto-fit {
  width: 1px;
  white-space: nowrap;
}

StackBlitz с работающим кодом находится здесь: https://stackblitz.com/edit/so-52815432-auto-fit-width-to-content

person hippeelee    schedule 16.10.2018
comment
Спасибо @hippeelee. Я разветвил ваш stackblitz. Я смог добиться того, чего хотел, с помощью этих классов CSS: stackblitz.com/edit/ - person Jeonsoft FaceBundy; 18.10.2018