Hola a todos. Mi problemas es el siguiente: Tengo una serie de imágenes dentro de cada elemento <td></td> de una tabla y lo que ocurre es que cuando cargo la página en Firefox. las imágenes me aparecen descuadradas o sin algunos de los "efectos" CSS que deberían aparecer...Creo que será mejor poner el código y explicarlo luego.
Código xhtml + PHP:
Código:
print '<table class = "imagenes" align = "center"><tr>'.
'<td><img src = "IMGs/quien/quien01.jpg" /></td>'.
'<td><img src = "IMGs/quien/quien02.jpg" /></td></tr></table>';
Código CSS:
Código:
table.imagenes td {
margin: 0;
padding: 3%;
text-align: center;
background: #FFFFFF;
border: 1px solid #ACCFE8;
}
Como podéis ver, lo que quiero es que las imagenes estén envueltas en una "caja" blanca y ésta caja, a su vez, tenga un borde de cierto color. El problema surge cuando conFirefox cargo por primera vez la página. Aparecen las imágenes con el "border: 1px solid #ACCFE8;" pero sin el espacio de 1% blanco o, a veces, aparece el espacio pero las imágenes ligeramente hacia la derecha. Lo curioso es que si recargo la página todo funciona bien: las imágenes se centran, aparecen los bordes en su sitio...
Alguien sabe cómo puedo solucionarlo? Ya sé que en vez de utilizar tablas debería evitarlas, pero tampoco está prohibido, y es una de las formas más cómodas y rápidas que tengo para mostrar las imágenes. De todas formas, usando tablas o no, el resultado debería ser correcto y no lo es.
Muchas gracias!