Ver Mensaje Individual
  #1 (permalink)  
Antiguo 17/11/2008, 03:01
Tarzan
 
Fecha de Ingreso: noviembre-2005
Ubicación: Alicante (España)
Mensajes: 242
Antigüedad: 18 años, 5 meses
Puntos: 1
Tabla bien cuadrada

Hola a todos/as,

Necesito implementar una tabla cuyas celdas tengan exactamente EL MISMO ANCHO. No me importa el alto y quiero que el contenido se ajuste a este último pero sin modificarme el ancho ni un sólo pixel.

He visto que en este foro ya hay algunos post que hablan sobre el diseño de tablas con celdas de tamaño fijo y he tratado de hacer lo que la gente indicaba pero no encuentro una solución exacta.

Indico el código html:
Cita:
table class=marcoCabeceraForo style='table-layout:fixed' width='747px' cellpadding=0 cellspacing=0>
<tr>
<td class=marcoCeldaNumeroForo width='11%'>Icono</td>
<td class=marcoCeldaTextoForo width='45%'>Subcategoría</td>
<td class=marcoCeldaTextoForo width='24%'>Último Tema</td>
<td class=marcoCeldaNumeroForo width='9%'>Temas</td>
<td class=marcoCeldaNumeroForo width='10%'>Mensajes</td>
</tr>
</table>

<table class=marcoSubcategoriaForo style='table-layout:fixed' width='747px' cellpadding=0 cellspacing=0>
<tr>
<!-- Icono -->
<td class=marcoCeldaNumeroForo width='11%' height='50px'><img src='icono.jpg'></img></td>
<!-- Subcategoria -->
<td class=marcoCeldaTextoForo width='45%' height='50px'>Normas del Foro</td>
<!-- Último Tema -->
<td class=marcoCeldaTextoForo width='24%' height='50px'>Recomendaciones y Consejos</td>
<!-- Número de Temas de la Subcategoría -->
<td class=marcoCeldaNumeroForo width='9%' height='50px'>5</td>
<!-- Número de Mensajes de la Subcategoría -->
<td class=marcoCeldaNumeroForo width='10%' height='50px'>1</td>
</tr>
</table>


y el CSS que utilizo:

Cita:
.marcoCabeceraForo {
FONT-FAMILY: Arial, Helvetica, sans-serif;
border: 1px ridge Black;
BACKGROUND-COLOR: #89A993;
height: 25px;
FONT-SIZE: 13px;
}

.marcoCeldaTextoForo {
border:1px ridge black;
font-family:Times New Roman;
color: Black;
text-align : left;
PADDING-LEFT: 10PX;
FONT-SIZE: 13px;
table-layout: fixed;
}

.marcoCeldaNumeroForo {
border:1px ridge black;
font-family:Times New Roman;
color: Black;
text-align : center;
table-layout: fixed;
FONT-SIZE: 13px;

}

El contenido de las celdas que indico lo he introducido manualmente ya que el mi proyecto lo capturo de una base de datos con php.
Sé que la desviación del ancho de las celdas es mínima y sólo vaía uno o dos pixeles pero quiero que todas las celdas tengan exactamente el mismo ancho.
Si el contenido es superior al ancho especificado, la celda puede agrandarse a lo alto para mostrar todo el texto.

He probado también con divs pero no he llegado a conseguir lo que quiero.
¿Puede alguien ayudarme?

Saludos,