Ver Mensaje Individual
  #4 (permalink)  
Antiguo 27/10/2008, 10:42
alfredorz
 
Fecha de Ingreso: junio-2008
Mensajes: 56
Antigüedad: 15 años, 10 meses
Puntos: 1
Respuesta: Problema centrado verticalemente celda??

El estilo css que tengo implementado es:

Tengo que decir que soy un poco novato en esto de los estilos....

Cita:
td {
font-family:verdana,arial;
font-size:8pt;
vertical-align: middle;

}
.estilotabla{

background-color:url(images/img01.jpg) no-repeat top left;
border-style:solid;
border-color:#07C4D7;
border-width:2px;

}
.estilocelda{
background-color:#F6FEFF;
border-style:solid;
border-color:#07C4D7;
border-width: 1px;
font-weight:bold;
font-size:10pt;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
vertical-align: middle;
color:#808080;/*#000000*/
}
.estilocabecera{
background-color:#00B4CF;/*COLOR MENU CABECERA= #0AC8D8*/
border-color:#07C4D7;
border-style:solid;
border-width: 1px;
font-weight:bold;
font-size:10pt;
text-align:center;
font-family:arial,helvetica,sans-serif;
color:#FFFFFF;
vertical-align: middle;
}
Y el codigo html donde implemento la tabla que usa estilos es:

Cita:
<table width="100%" height="100%" border="0" class="estilotabla" >

<!-- cabecera de la tabla -->
<tr >
<td class="estilocabecera" width="14%"><p></p></td>
<td class="estilocabecera" width="14%" ><p>Lunes</p></td>
<td class="estilocabecera" width="14%"><p>Martes</p></td>
<td class="estilocabecera" width="14%"><p>Miercoles</p></td>
<td class="estilocabecera" width="14%"><p>Jueves</p></td>
<td class="estilocabecera" width="14%"><p>Viernes</p></td>
<td class="estilocabecera" width="14%"><p>Total Horas Semana</p></td></tr>

<!-- horas de entrada de cada dia de la semana -->
<tr >
<td class="estilocelda" width="14%" ><p>Hora Entrada</p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["LUNES"]["Entrada"]["hora"];?></p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["MARTES"]["Entrada"]["hora"]; ?></p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["MIERCOLES"]["Entrada"]["hora"];?></p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["JUEVES"]["Entrada"]["hora"]; ?></p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["VIERNES"]["Entrada"]["hora"];?></p></td>
<td class="estilocelda" width="14%"><p>-----<p></td>
</tr>

<!-- horas de salida de cada dia de la semana -->
<tr >
<td class="estilocelda" width="14%"><p>Hora Salida</p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["LUNES"]["Salida"]["hora"];?></p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["MARTES"]["Salida"]["hora"]; ?></p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["MIERCOLES"]["Salida"]["hora"];?></p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["JUEVES"]["Salida"]["hora"]; ?></p></td>
<td class="estilocelda" width="14%"><p><?php echo $array_ordenado["VIERNES"]["Salida"]["hora"];?></p></td>
<td class="estilocelda" width="14%"><p>-----<p></td>
</tr>

<!-- horas totales de cada dia de la semana -->
<tr>
<td class="estilocabecera" width="14%"><p>Total Dia</p></td>
<td class="estilocabecera" width="14%"><p><?php echo $horas_lunes; ?></p></td>
<td class="estilocabecera" width="14%"><p><?php echo $horas_martes; ?></p></td>
<td class="estilocabecera" width="14%"><p><?php echo $horas_miercoles; ?></p></td>
<td class="estilocabecera" width="14%"><p><?php echo $horas_jueves; ?></p></td>
<td class="estilocabecera" width="14%"><p><?php echo $horas_viernes; ?></p></td>
<td class="estilocabecera" width="14%" ><font size=+0><p><?php echo $horas_totales ?></p></font></td>
</tr>
</table>
Son 4 filas, la ultima y primera tiene estilo cabecera que solo cambia el fondo y el tipo de letras.

Poniendo el atributo vertical-align=middle a todos los estilos no los centra.

Muchas gracias, espero vuestra solución.