Como posso ocultar uma linha da tabela HTML <tr> para que não ocupe espaço?

Como posso ocultar uma linha de tabela HTML <tr>para que ela não ocupe espaço? Eu tenho vários <tr>definidos como style="display:none;", mas eles ainda afetam o tamanho da tabela e a borda da tabela reflete as linhas ocultas.

Eu realmente gostaria de ver o estilo do seu TABLE. Por exemplo, "colapso da fronteira"

Apenas um palpite, mas pode afetar como as linhas 'ocultas' estão sendo renderizadas.

Você pode incluir algum código? Eu adiciono style="display:none;"linhas à minha tabela o tempo todo e isso efetivamente oculta toda a linha.

Você pode definir <tr id="result_tr" style="display: none;">e mostrar de volta com JavaScript:

var result_style = document.getElementById('result_tr').style;
result_style.display = 'table-row';

Pensei em adicionar a isso uma outra solução potencial:

<tr style='visibility:collapse'><td>stuff</td></tr>

Eu apenas testei no Chrome, mas colocar isso <tr>oculta a linha MAIS todas as células dentro da linha ainda contribuem para as larguras das colunas. Às vezes, farei uma linha extra na parte inferior de uma tabela com apenas alguns espaçadores que fazem com que certas colunas não possam ter menos do que uma certa largura e, em seguida, ocultarei a linha usando este método. (Eu sei que você deveria ser capaz de fazer isso com outro css, mas nunca fiz isso funcionar)

Novamente, estou em um ambiente puramente cromado, então não tenho ideia de como isso funciona em outros navegadores.

Se display: none;não funcionar, que tal configurar em height: 0;vez disso? Em conjunto com uma margem negativa (igual ou maior que a altura das bordas superior e inferior, se houver) para remover ainda mais o elemento? Não creio que position: absolute; top: 0; left: -4000px;funcione, mas pode valer a pena tentar.

Pela minha parte, usar display: nonefunciona bem.

Adicione algumas das seguintes linhas de altura: 0px; font-size: 0px; height: 0px; margin: 0; padding: 0;

Eu esqueci qual deles faz isso. Acho que é a altura da linha para o IE6.

Eu estava tendo o mesmo problema, até adicionei style = "display: none" a cada célula.

No final, usei comentários HTML <!-- [HTML] -->

Você pode usar o estilo display: none com tr para ocultar e funcionará com todos os navegadores.

var result_style = document.getElementById('result_tr').style;
result_style.display = '';

está funcionando perfeitamente para mim ..

Isso aconteceu comigo e fiquei perplexo com o porquê. Então eu percebi que se eu removesse qualquer nbsp; eu tinha dentro das linhas, então as linhas não ocuparam nenhum espaço.

Você precisa colocar a mudança do tipo de entrada para oculto, todas as funções dele funcionam, mas não é visível na página

<input type="hidden" name="" id="" value="">

contanto que o tipo de entrada seja definido para que você possa alterar o resto. Boa sorte!!

Eu estava tendo o mesmo problema e resolvi o problema. O CSS anterior era overflow: hidden; índice z: 999999;

Eu mudo para overflow: visible;

HTML:

<input type="checkbox" id="attraction" checked="checked" onchange="updateMap()">poi.attraction</input>

JavaScript:

function updateMap() {
     map.setOptions({'styles': getStyles() });
} 

function getStyles() {
    var styles = [];
    for (var i=0; i < types.length; i++) {
      var style = {};
      var type = types[i];
      var enabled = document.getElementById(type).checked;
      style['featureType'] = 'poi.' + type;
      style['elementType'] = 'labels';
      style['stylers'] = [{'visibility' : (enabled ? 'on' : 'off') }];
      styles.push(style);
    }
    return styles;
}

position: absolute irá removê-lo do fluxo de layout e deve resolver seu problema - o elemento permanecerá no DOM, mas não afetará os outros.

Você pode definir

<table>
  <tr style="visibility: hidden"></tr>
</table>