Como posso forçar um TD sem conteúdo para renderizar sua fronteira?

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

Pergunta

O TD tem uma div dentro da qual removi usando a função de desvanecimento de JQuery, mas quando termina a borda também desaparece.

Quero evitar isso, existe outra maneira além de adicionar um "" (o que faz com que seja feio)?

Edit: estou usando o Internet Explorer (6 e 7)

Foi útil?

Solução

CSS:

table {
  empty-cells: show;
}

Você também precisa colocar o IE no modo de renderização de padrões para que isso funcione. Depois de adicionar um doctype, pelo menos o IE8 (beta 2 e superior) toca bem.

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

IE7 e abaixo ainda não o fará. Suporte para empty-cells Diz -se que é "parcial" (para IE7 e IE8 beta 1) em a declaração de compatibilidade do MS CSS. O que quer que "parcial" significa, não implementar o "programa" dificilmente pode ser chamado de "suporte parcial". Esses navegadores podem ser forçados a desenhar as fronteiras das células, geralmente em colapso nas fronteiras da mesa:

table {
  border-collapse: collapse;   
}

A configuração de empty-cells é ignorado. Mas depois de entrar em colapso nas fronteiras, você não precisa definir isso de qualquer maneira, porque todos os navegadores exibirão fronteiras em colapso.

Outras dicas

u003Ctd style="font-size: 1pt"> u003Ctd>

Adicione um espaço sem quebra à célula:

<td>&nbsp;</td>

Um hack, mas um hack melhor do que adicionar uma imagem.

Acabei adicionando uma imagem de 1px transparente à célula como sugerido por Jukka "Yucca" Korpela. Por enquanto, vou usar esta solução se não houver alternativa melhor

Então, se você tiver uma tabela como abaixo:

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

E você desaparece, com jQuery, almoço, por que não trazer de volta um nada em branco com Fadein?

Como abaixo:

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

Dependendo do que exatamente você está tentando realizar, você pode definir o visibility-Property of the Div para hidden em vez de definir seu display-Property para none, ou seja, você teria que restaurar display e opacity E definir visibility manualmente após a chamada para fadeOut().

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top