Foros del Web » Programando para Internet » Javascript »

Ancho de <td> me tiene loco

Estas en el tema de Ancho de <td> me tiene loco en el foro de Javascript en Foros del Web. Hola [email protected] les cuento que estoy desesperado con esto, debe ser una bobada pero definitivamente no lo entiendo. Tengo este codigo: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código HTML: ...
  #1 (permalink)  
Antiguo 03/01/2012, 14:50
Avatar de malakian  
Fecha de Ingreso: septiembre-2010
Ubicación: $malakian->Colombia();
Mensajes: 469
Antigüedad: 12 años, 4 meses
Puntos: 45
Ancho de <td> me tiene loco

Hola [email protected] les cuento que estoy desesperado con esto, debe ser una bobada pero definitivamente no lo entiendo.

Tengo este codigo:

Código HTML:
Ver original
  1. <div style="overflow:scroll; width:auto; height:255px;background-color: #FFFFFF; border:solid">
  2.   <table class="articulos">
  3.     <tbody id="CuerpoTabla" >
  4.                                
  5.     </tbody>
  6.   </table>
  7. </div>

Hasta el momento no ahi problema, la cuestion es que por medio de una funcion hago una peticion AJAX que me devuelve unos datos, estos datos viene en algo asi:

Código HTML:
Ver original
  1. <tr><td>Dato1</td>
  2. <td>Dato2</td><td>DatoX</td></tr>

y quiero meter esos datos dentro del tbody anterior, para eso hago
Código Javascript:
Ver original
  1. var elmTBODY = document.getElementById('CuerpoTabla');
  2. elmTR = elmTBODY.insertRow(0);
  3. elmTR.innerHTML = '<tr><td>Dato1</td><td>Dato2</td><td>DatoX</td></tr>';

Hasta ahi todo funciona bien, pero lo que quiero es que me ocupen todo el ancho del div en el que esta contenida la tabla, escribo width="100%" y nada, aumento el width de cada td individualmente y tampoco, ejemplo:


Código HTML:
Ver original
  1. <tr><td width="5%">Dato1</td><td width="10%">Dato2</td><td width="20%">DatoX</td></tr> ...etc etc etc

pero no se que pasa el ancho se vuelve loco, no me hace caso, a veces se ensancha mucho, a veces no hace nada, diganme que estoy haciendo mal por favor, o que tipo de estilo deberia usar??? ya me tiene loco enserio
__________________
Guitar Loco, Desarrollador Web PHP
Sigueme: @jose1x
  #2 (permalink)  
Antiguo 03/01/2012, 15:03
Avatar de jenusys  
Fecha de Ingreso: diciembre-2008
Ubicación: Ahí mismo.
Mensajes: 216
Antigüedad: 14 años, 1 mes
Puntos: 11
Respuesta: Ancho de <td> me tiene loco

¿Por qué no trazas TODA la tabla desde su origen? Si es por tiempo de ejecución te aseguro que unos milisegundos de diferencia no se notarán mucho que digamos.
  #3 (permalink)  
Antiguo 03/01/2012, 15:10
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 14 años, 7 meses
Puntos: 1011
Respuesta: Ancho de <td> me tiene loco

creo que te problema se resuelve con css (table-layout)
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}
  #4 (permalink)  
Antiguo 03/01/2012, 15:15
Avatar de malakian  
Fecha de Ingreso: septiembre-2010
Ubicación: $malakian->Colombia();
Mensajes: 469
Antigüedad: 12 años, 4 meses
Puntos: 45
Respuesta: Ancho de <td> me tiene loco

Hola @jenusys desafortunadamente para mi tengo que dejarlo asi, tambien lo habia pensado asi, ahi alguna solucion??
dandole un width a los td's individualmente no se comportan de una manera deseada
__________________
Guitar Loco, Desarrollador Web PHP
Sigueme: @jose1x
  #5 (permalink)  
Antiguo 03/01/2012, 15:42
Avatar de malakian  
Fecha de Ingreso: septiembre-2010
Ubicación: $malakian->Colombia();
Mensajes: 469
Antigüedad: 12 años, 4 meses
Puntos: 45
Respuesta: Ancho de <td> me tiene loco

Hola @IsaBelM contigo he aprendido algo nuevo, la verdad desconocia esa propiedad, sin embargo, no me funciona, trate de colocar unas celdas iniciales con los tamaños que queria, para ver si las nuevas tomaban el mismo tamaño, pero no, es mas me modifica las celdas iniciales....

Tambien coloque tamaños individuales y tampoco, use table-layout: fixed;


algun otro consejo?? gracias
__________________
Guitar Loco, Desarrollador Web PHP
Sigueme: @jose1x
  #6 (permalink)  
Antiguo 03/01/2012, 16:49
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 14 años, 7 meses
Puntos: 1011
Respuesta: Ancho de <td> me tiene loco

entonces el problema es que al último td le asignas un width. compara
Cita:
<div style="overflow:auto; width:scroll; height:255px;background-color: #FFFFFF; border:solid">
<table style="width:100%;">
<tbody id="CuerpoTabla" >
<tr><td style="width:5%">Dato1</td><td style="width:10%">Dato2</td><td style="width:20%">DatoX</td></tr>
<tr><td>nuevo Dato1 con mas texto</td><td>Dato2</td><td>DatoX</td></tr>
</tbody>
</table>
<div>
Cita:
<div style="overflow:auto; width:scroll; height:255px;background-color: #FFFFFF; border:solid">
<table style="width:100%;">
<tbody id="CuerpoTabla" >
<tr><td style="width:5%">Dato1</td><td style="width:10%">Dato2</td><td>DatoX</td></tr>
<tr><td>nuevo Dato1 con mas texto</td><td>Dato2</td><td>DatoX</td></tr>
</tbody>
</table>
<div>
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}
  #7 (permalink)  
Antiguo 04/01/2012, 12:09
Avatar de malakian  
Fecha de Ingreso: septiembre-2010
Ubicación: $malakian->Colombia();
Mensajes: 469
Antigüedad: 12 años, 4 meses
Puntos: 45
Respuesta: Ancho de <td> me tiene loco

Hola @IsaBelM bueno, dejame contarte que lo de table-layout me funciono, pero esas celdas creadas dinamicamente se deben poder ocultar y mostrar, y cuando las oculto y las vuelvo a mostrar es que se descontrolan... lo hago con una funcion que hace esto dependiendo el caso

Código Javascript:
Ver original
  1. document.getElementById("celda1").style.display = "none";
  2.  
  3. // o para mostrarlo
  4.  
  5. document.getElementById("celda1").style.display = "block";

siento que me estoy poniendo fastidioso, pero es que este comportamiento de las celdas es indeseable, enserio, agradezco mucho la ayuda
__________________
Guitar Loco, Desarrollador Web PHP
Sigueme: @jose1x
  #8 (permalink)  
Antiguo 04/01/2012, 16:37
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 14 años, 7 meses
Puntos: 1011
Respuesta: Ancho de <td> me tiene loco

celda1 es la id de un td?? si es así, es normal que se descuadre todo. la única propiedad que conozco que hará que una celda no sea mostrada y aún así continúe ocupando espacio es empty-cells. la condición es que la celda no ha de tener contenido. por lo tanto, no es una solución y no creo que la haya

edito: si lo que realmente ocultas y muestras son todas la filas y columnas creadas, no comprendo ese comportamiento
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}

Última edición por IsaBelM; 04/01/2012 a las 20:15

Etiquetas: ajax, dom, tablas, width
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:18.