Как я могу заставить TD без содержимого отображать его границы? - PullRequest
Новая
       8

Как я могу заставить TD без содержимого отображать его границы?

1 голос
/ 02 марта 2009

TD имеет DIV, внутри которого я удалил, используя функцию fadeOut в jQuery, но когда он закончится, граница исчезнет.

Я хочу избежать этого, есть ли другой способ, кроме добавления "& nbsp;" (что делает его уродливым)?

РЕДАКТИРОВАТЬ: я использую Internet Explorer (6 и 7)

Ответы [ 6 ]

9 голосов
/ 02 марта 2009

CSS: 

table {
  empty-cells: show;
}

Вам также нужно перевести IE в стандартный режим рендеринга, чтобы это работало. После добавления типа документа, по крайней мере, IE8 (бета-версия 2 и выше) играет хорошо. 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
 "http://www.w3.org/TR/html4/loose.dtd">

IE7 и ниже все еще не будут делать это. Говорят, что поддержка empty-cells является «частичной» (для IE7 и IE8 Beta 1) на в заявлении о совместимости MS CSS . Что бы ни означало «частичное», отсутствие реализации «шоу» вряд ли можно назвать «частичной поддержкой». Эти браузеры можно принудительно рисовать границы ячеек, обычно сворачивая границы таблицы: 

table {
  border-collapse: collapse;   
}

Настройка empty-cells игнорируется. Но как только вы свернете границы, вам все равно не придется их устанавливать, потому что все браузеры будут отображать свернутые границы.

5 голосов
/ 02 марта 2009

& nbsp;
5 голосов
/ 02 марта 2009

Добавить неразрывный пробел в ячейку:

<td>&nbsp;</td>

Взломать, но лучше взломать, чем добавить изображение.

3 голосов
/ 02 марта 2009

Я добавил прозрачное изображение размером 1 пиксель в ячейку, как , предложенное Юккой "Юккой" Корпела . Пока я буду использовать это решение, если нет лучшей альтернативы

0 голосов
/ 02 марта 2009

Так что если у вас есть таблица, как показано ниже: 

<table border="1">
<tr>
 <td>Breakfast</td>
 <td><div id="foo">Lunch</div></td>
 <td>Dinner</td></tr>
</table>

А вы fadeOut, с jQuery, Lunch, почему бы не вернуть пустое ничего с fadeIn?

Как показано ниже: 

$("#foo").fadeOut("slow").html('').fadeIn("fast");
0 голосов
/ 02 марта 2009

В зависимости от того, что именно вы пытаетесь выполнить, вы можете установить для свойства visibility элемента div значение hidden вместо установки для свойства display значения none, то есть вам придется восстановите display и opacity и установите visibility вручную после вызова на fadeOut().

...