コンテンツのないTDにその境界線をレンダリングさせるにはどうすればよいですか？

StackOverflow https://stackoverflow.com/questions/602285

質問

TDには、jQueryのfadeOut関数を使用して削除したDIVがありますが、終了すると境界線も消えます。

それを避けたいのですが、<！> quot; <！> amp; nbsp; <！> quot;を追加する以外の方法はありますか？ （これにより見苦しくなります）？

編集：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のサポートは<！> quot; partial <！> quotと言われます。 （IE7およびIE8 Beta 1の場合） MS CSS互換性文。何でも<！> quot; partial <！> quot;は、<！> quot; show <！> quot;を実装しないことを意味します。 <！> quot; partial support <！> quot;と呼ぶことはほとんどできません。これらのブラウザは、通常、テーブルの境界線を折りたたむことにより、セルの境界線を強制的に描画できます。

table {
  border-collapse: collapse;   
}

<=>の設定は無視されます。ただし、いったん境界線を折りたたむと、すべてのブラウザで折りたたまれた境界線が表示されるため、とにかく設定する必要はありません。

他のヒント

<！> lt; td style = <！> quot; font-size：1pt <！> quot; <！> gt; <！> amp; nbsp; <！> lt; td <！> gt;

セルに改行しないスペースを追加します：

<td>&nbsp;</td>

ハックですが、画像を追加するよりも優れたハックです。

によって提案されたように、透明な1px画像をセルに追加しましたユッカ<！> quot;ユッカ<！> quot;コルペラ。今のところ、より良い代替手段がない場合、このソリューションを使用します

したがって、以下のようなテーブルがある場合：

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

そして、jQuery、Lunchを使用して、fadeOutを使用し、fadeInを使用して何も空白に戻さないでください。

下のように：

$("#foo").fadeOut("slow").html('').fadeIn("fast");

何を達成しようとしているかによって、divのvisibility-propertyをhiddenに設定する代わりに、divのdisplay-propertyをnoneに設定できます。つまり、 opacity およびfadeOut() を復元し、<=>の呼び出し後に<=>を手動で設定します。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top