fijar cabecera para tablas definidas en %

[[kayetano]]

Hola

Podrías indicar una página o poner una porción del código (no te pases) para tener un poco mas claro tu ejemplo, he intentado realizar una prueba pero no termina de cuadrarme lo que tu me dices.

[Paco]

Hola, aqui tienes una de las tablas con la que tengo este problema. Puedes probar sustituyendo los datos que devuelve el DTO por otros que metas tu hasta que desbordes el height de 186 y veras que cuando aparece el scroll la cabecera y la tabla de datos se descuandran.

Código PHP:

<div id="Layer1" style="width:95%;">
<table width="100%" border="1" cellpadding="0" cellspacing="0"
  bordercolordark="#FFFFFF" bordercolorlight="#CCCCCC" >
<tr>
<td class="text2" width="10%" align="center">Fecha Cita</td>
<td class="text2" width="10%" align="center">Hora Cita</td>
<td class="text2" width="10%" align="center">Asiste</td>
<td class="text2" width="20%" align="center">Nombre Expediente</td>
<td class="text2" width="15%" align="center">Fecha Apertura</td>
<td class="text2" width="15%" align="center">Fecha Cierre</td>
<td class="text2" width="20%" align="center">Profesional</td>
</tr>

</table>
</div>


<div id="Layer2" style="width:95%; height:186; z-index:1; overflow-y:auto">


<table width="100%" border="1" cellpadding="0" cellspacing="0"
  bordercolordark="#FFFFFF" bordercolorlight="#CCCCCC" >
<logcresent name="citasForm" property="colCitas">
<logc:iterate id="colCitas" name="citasForm" property="colCitas" indexId="ctr">
<bean:define id="cita" name="colCitas" type="...dto.DTOCitas"/>
<tr>

<td class="text3" width="10%" align="center">
<bean:write name="colCitas" property="f_cit_fecha"/>&nbsp;</td>
<td class="text3" width="10%" align="center">
<bean:write name="colCitas" property="t_cit_hora"/>&nbsp;</td>
<td class="text3" width="10%" align="center">
<input type="checkbox" id="sel" <%= checked %> <%= disabled %> value="<%= cita.getC_cit_id() %>"
  onclick="llenoValores(this.value);">
</td>
<td class="text3" width="20%" align="center">
<bean:write name="colCitas" property="t_exp_nombre"/>&nbsp;</td>
<td class="text3" width="15%" align="center">
<bean:write name="colCitas" property="f_exp_inicio"/>&nbsp;</td>
<td class="text3" width="15%" align="center">
<bean:write name="colCitas" property="f_exp_final"/>&nbsp;</td>
<td class="text3" width="20%" align="center">
<bean:write name="colCitas" property="nombreProfesional"/>&nbsp;</td>
</tr>
</logc:iterate>
</logcresent>
</table>


</div> 


[[kayetano]]

Hola

ok, ya tengo claro y probado el problema, que yo sepa no hay solución con el método que tu estas usando. Mi pregunta es ¿por que no utilizas una sola tabla para la cabecera y el contenido?

PD. No terminaba de entender lo de la barra de Scroll, y despúes de ver tu ejemplo he podido comproba que en FireFox (pero solo en este navegador) aparece una barra de scroll.

[Paco]

gracias por responder,

Lo de las dos tablas es para hacer que la cabecera no me desaparezca al mover el scroll hacia abajo, es decir una tabla esta fija y representa la cabecera y la otra se mueve con el scroll y representa los datos. si pones el overflow-y a hidden o bien tienes menos de 186 px de datos en la tabla inferior veras que las columnas de la cabecera se corresponden con las columnas de los datos, en cambio cuando superas esos 186 px de datos y tienes el overflow-y a auto aparece un scroll en la tabla inferior que descuadra las columnas. Mi problema es como mantener cuadradas las columnas sin dejar de utilizar los %

un saludo

[[kayetano]]

Hola

La verdad es que no se me ocurre nada. Igual con JavaScript puedes hacer algo, pero le tienes crudo. Piensa que entre las dos tablas no existe ninguna relación por lo tanto cada una de ellas se comporta de diferente forma.

Siento no poder ayudarte.

[Paco]

Gracias de todas formas

un saludo

[roman]

Hablo un poco en el aire ya que no sé si funcione. ¿Qué pasa si defines tu tabla así:

Código PHP:

<table>
<thead>
  <tr><td></td><td></td></tr>
</thead>
<tbody>
  <tr><td></td><td></td></tr>
  <tr><td></td><td></td></tr>
  <tr><td></td><td></td></tr>
  <tr><td></td><td></td></tr>
</tbody>
</table> 


y pones el overflow a la etiqueta <tbody>?

Creo recordar que esto funciona en un navegador y no en otro. Habría que probar.

// Saludos