Come posso forzare un TD senza contenuto per renderizzare il suo bordo?

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

Domanda

Il TD ha un DIV all'interno che ho rimosso usando la funzione fadeOut di jQuery, ma quando finisce anche il bordo scompare.

Voglio evitarlo, c'è altro modo che aggiungere un " & amp; nbsp; " (che lo rende brutto)?

EDIT: sto usando Internet Explorer (6 e 7)

È stato utile?

Soluzione

CSS: 

table {
  empty-cells: show;
}

Devi anche mettere IE in modalità rendering standard per farlo funzionare. Dopo aver aggiunto un doctype, almeno IE8 (Beta 2 e versioni successive) funziona bene. 

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

IE7 e precedenti non lo faranno ancora. Il supporto per empty-cells è considerato & Quot; parziale & Quot; (per IE7 e IE8 Beta 1) su la compatibilità con MS CSS dichiarazione . Qualunque sia & Quot; parziale & Quot; significa che non implementando " show " difficilmente può essere chiamato " supporto parziale " ;. Questi browser possono essere costretti a disegnare i bordi delle celle collassando generalmente i bordi della tabella: 

table {
  border-collapse: collapse;   
}

L'impostazione di <=> viene ignorata. Ma una volta collassati i bordi, non è necessario impostarli comunque, poiché tutti i browser visualizzeranno i bordi compressi.

Altri suggerimenti

< td style = " font-size: 1pt " > & amp; nbsp; < td >

Aggiungi uno spazio non interrotto alla cella:

<td>&nbsp;</td>

Un trucco, ma un trucco migliore rispetto all'aggiunta di un'immagine.

Ho finito per aggiungere un'immagine 1px trasparente alla cella come suggerito da Jukka & Quot; Yucca & Quot; Korpela . Per ora userò questa soluzione se non ci sono alternative migliori

Quindi se hai una tabella come sotto: 

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

E tu svanisci, con jQuery, Lunch, perché non riportare nulla in bianco con fadeIn?

Come sotto: 

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

A seconda di cosa esattamente stai cercando di realizzare, puoi impostare la proprietà visibility - del div su hidden invece di impostare la sua proprietà display - su none, cioè dovresti ripristinare opacity e fadeOut() e impostare <=> manualmente dopo la chiamata su <=>.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top