Foros del Web - Ver Mensaje Individual - [AYUDA]Problema ocultar/mostrar celda de una tabla sin que se descoloque el contenido

emprear · #5 (**permalink**) 28/10/2012, 09:10

Edito:
Esta vez me madrugaste voz @furoya

@hosyou :

Por favor cuando hagas este tipo de preguntas, poné todo el código completo y no fragmentado.
Tu html está bastante sucio, y los id no pueden ser ni comenzar por un número. Asi y todo entiendo el problema (que no se da en IE), una posible solución, si es que la estructura se repite es

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>titulo</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript">
//<![CDATA[
function ShowHide(fila) {
 if ((document.getElementById(fila).style.display) == 'block') {
  document.getElementById(fila).style.display = 'none';
 }
 else {
  document.getElementById(fila).style.display = 'block';
 }
}
//]]>
</script>
</head>
<body>
<table border='1' style="border-collapse:separate;empty-cells:hide;">
<tr bgcolor='silver'>
<th align='center' width='100'>N° Id</th>
<th align='center' width='100'>DNI</th>
<th align='center'>Nombre</th>
<th align='center'>E-mail</th>
<th align='center'>&nbsp;</th>
</tr>
 
<tr>
<td align='center'>ID_1</td>
<td align='center'>DNI_1</td>
<td>Nombre_1</td>
<td>Email_1</td>
<td><button onclick='ShowHide("a1111")'>Ver Grupos</button></td>
</tr>
<tr>
<td align='center' colspan='5'>
<table border='1' align="center" style="display: none;"  id='a1111' >
<tr>
<th align='center' colspan='4'>TABLA 2</th>
</tr>
<tr>
<td align='center'>ASDAD</td>
<td align='center'>ASDAD</td>
<td align='center'>ASDAD</td>
<td align='center'>ASDAD</td>
</tr>
</table>
</td>
</tr>
 
<tr>
<td align='center'>ID_2</td>
<td align='center'>DNI_2</td>
<td>Nombre_2</td>
<td>Email_2</td>
<td><button onclick='ShowHide("a1112")'>Ver Grupos</button></td>
</tr>
<tr>
<td align='center' colspan='5'>
<table border='1' align="center" style="display: none;"  id='a1112' >
<tr>
<th align='center' colspan='4'>TABLA 3</th>
</tr>
<tr>
<td align='center'>ASDAD</td>
<td align='center'>ASDAD</td>
<td align='center'>ASDAD</td>
<td align='center'>ASDAD</td>
</tr>
</table>
</td>
</tr>
 
 
</table>
</body>
</html>

Saludos