Проблема работы спана с text-overflow:ellipsis

semitri · 14.11.2006, 13:08

Уважаемые Дамы и Господа.

Столкнулся с проблемрой и надеюсь Вы поможете мне ее решить.

Есть некая таблица из 2 ячеек, в одной из которых находится SPAN с неким текстом. Для SPANа прописаны в стилях следующие особенности:

text-overflow:ellipsis; overflow:hidden;

Благодаря этому, при сжатии спана, текст постепенно скрывается.
Это не работает в случае если SPAN помещен в ячейку таблицы. Почему непонимаю.

Кроме этого, это работает только в IE.

Внимание вопрос: Можно ли заставить работать спан с text-overflow:ellipsis; overflow:hidden; в ячейке (при сжатии окна с таблицей, текст вместе со спаном тоже должен сжиматься). И можно ли заставить работать подобную конструкцию в Firefox и Opera.

Заранее спасибо.

ВОТ КОД ПРИМЕРА:
----------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Untitled Document</title>
<style>

span.test1 { width:150px; height:150px; background-color:#FF0000; }

span.test2 { width:100%; height:150px; background-color:#FF0000; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }

</style>
</head>

<body>

<table width="100%" border="1">
<tr>
<td>
<span class="test2">
<p>4444444444444444444444444444444444444444444444444444</p>
<p>3333333333333333333333333333333</p>
<p>55555555555555555555555555555555555555</p>
</span>
</td>
<td>1111111111111111111111111111111</td>
</tr>
</table>

<span class="test2">
<p>4444444444444444444444444444444444444444444444444444</p>
<p>3333333333333333333333333333333</p>
<p>55555555555555555555555555555555555555</p>
</span>

</body>
</html>
----------------------------------------------------------------------

KidsKilla · 14.11.2006, 18:26

1. код неверен.
нельзя в строчный SPAN элемент вкладывать блочный P.

2. style="width:100%;height:100%;overflow:hidden;"

semitri · 14.11.2006, 18:53

1. Спассибо за замечание по тегу <p>. Честно говоря удивлен, ибо W3C ничего плохого по этому поводу не говорит. Так или иначе, но тег <p> в данный момент к проблеме отношения не имеет, я проверил.

2. Не понял, к чему стоит отнести этот стиль, к тому же в коде который я привел ранее overflow:hidden; проставлен.

KidsKilla · 15.11.2006, 19:52

а ширину с высотой видать забыл поставить

CAM · 16.11.2006, 11:57

<table width="500" border="1">
<tr>
<td width="20%" > </td>
<td width="20%" > </td>
<td width="20%" ><span style="width:100%;height:100%;overflow:hidden;">ajfvajhfadsfkdakfdak dfkda fkdfkdfkdshfh sdkjfdskhfkdshfkdshfkdshf</span></td>
<td width="20%" > </td>
<td width="20%" > </td>

типо такая система неабоает