Google Chrome: как отображать полный текст при наведении курсора мыши на ячейку таблицы - PullRequest
Новая
       24

Google Chrome: как отображать полный текст при наведении курсора мыши на ячейку таблицы

0 голосов
/ 27 июня 2018

Ожидаемое поведение

У меня есть таблица на моей веб-странице. В некоторых ячейках таблицы он имеет длинный текст, и я установил эти css для метки td. Если текст длиннее ширины ячейки таблицы, он будет скрыт. 

td {
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

Когда курсор мыши находится над этими ячейками таблицы, я хочу, чтобы появился полный текст.

Текущее поведение

Для сафари , когда мышь наводит курсор на ячейку таблицы с длинным текстом, появляется полный текст. enter image description here

Для Google Chrome , когда курсор мыши над ним не реагирует, реакции не происходит. enter image description here Вопрос

Как Google Chrome может отображать полный текст, как сафари? Любые предложения или идеи будут приветствоваться.

Ответы [ 2 ]

0 голосов
/ 28 июня 2018

Я думаю, в вашем случае лучше поставить атрибуты "title" в вашем <td>. Подробнее об атрибутах заголовка

Например: 

<td title='Full Text about School 1'>School 1 Data</td>
<td title='Full Text about School 2'>School 2 Data</td>
...
<td title='Full Text about School X'>School X Data</td>
0 голосов
/ 27 июня 2018

Вы можете использовать атрибут заголовка: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/title

<p>Newlines in title should be taken into account, like this <abbr title="This is a
multiline title">example</abbr>.</p>
...