Как я могу заставить TD без содержимого отображать его границу?
-
03-07-2019 - |
Вопрос
В TD есть DIV, внутри которого я удалил с помощью функции fadeOut от jQuery, но когда она завершается, граница тоже исчезает.
Я хочу избежать этого, есть ли какой-нибудь другой способ, кроме добавления "" (что делает его уродливым)?
Редактировать:Я использую Internet Explorer (6 и 7)
Решение
CSS:
table {
empty-cells: show;
}
Вам также необходимо перевести IE в стандартный режим рендеринга, чтобы это сработало.После добавления doctype, по крайней мере, 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.Что бы ни означало "частичная", отсутствие реализации "show" вряд ли можно назвать "частичной поддержкой".Эти браузеры могут быть вынуждены рисовать границы ячеек, обычно сворачивая границы таблицы:
table {
border-collapse: collapse;
}
Установка empty-cells
игнорируется.Но как только вы свернете границы, вам все равно не нужно это устанавливать, потому что все браузеры будут отображать свернутые границы.
Другие советы
1pt"> <td>
Добавьте неразрывный пробел в ячейку:
<td> </td>
Взлом, но лучший взлом, чем добавление изображения.
В итоге я добавил прозрачное изображение размером 1 пиксель в ячейку следующим образом предложено Юккой "Юкка" Корпелой.На данный момент я буду использовать это решение, если нет лучшей альтернативы
Итак, если у вас есть таблица, подобная приведенной ниже:
<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");
В зависимости от того, чего именно вы пытаетесь достичь, вы могли бы установить visibility
-свойство div для hidden
вместо того, чтобы устанавливать его display
-собственность на none
, т. е. вам пришлось бы восстанавливать display
и и установить opacity
visibility
вручную после вызова fadeOut()
.