Tengo un problema con una web del curro. Es un problema extraño y que no he conseguido reproducir de forma esquemática, así que el tema versa ya más de teoría que de práctica.
Tengo una web, generada con un framework de jsp propietario que mete un montón de guarrerías por medio, casi todas son tablas y td's con estilo width 100%.
Esta tabla he conseguido meterla en un div con style="margin: 0 auto; width:1024px;"
O sea, una estructura algo así como esto:
Código:
Mi tabla 'datos_tabulados' recibe datos de una BD y puede (y de hecho, lo hace) crecer a lo ancho hasta un tamaño indeterminado.<div style="margin: 0 auto; width:1024px;">
<table width="100%">
<tr>
<td>
. . . Demás cosas que pone el framework a base de más tables trs y tds . . .
<div id="MI_CONTENIDO">
<table id="datos_tabulados">
. . .
</div>
</div>
El caso es que todo funciona bien en todos los navegadores que he pobado, incluyendo IE8, Safari, Opera y FF. En IE7, sin embargo, ocurre lo siguiente:
La tabla crece hasta hacerse más grande de los 1024px a lo que tengo limitado el ancho. Toda la pantalla se desplaza hacia la derecha, porque me aumenta el margen, que tengo marcado como auto para el ancho.
La tabla crece en anchura. Pero, en lugar de mostrarse entera, queda cortada a los 1024 px. Según el depurador de IE, la tabla mide 2500px, pero sólo muestra por pantalla los 1024px de la izquierda. La tabla no lleva la propiedad overflow, ni clip, ni nada por el estilo, ni tampoco las hereda.
En el resto de navegadores no sucede ni una cosa ni la otra...
He comprobado que, si pongo la propiedad margin del div superior a cualquier cosa que no sea auto, el problema del descuadre se resuelve por sí sólo. Sin embargo, el del clipeo de la tabla no lo consigo resolver.
Estaba pensando en indicar un width dinámico para windows, con expresiones, de forma que, si la web se hace mayor de 1024, que el margen se ponga a 0.
¿No hay otra solución? ¿Por qué sucede ésto? ¿Cuál es el comportamiento por defecto del margin:auto en el IE7?
Para el clipeo, he probado metiendo la tabla en un div, limitandole con width:1000px; overflow:visible, pero nada de nada... ¿Debería meterle el overflow al div superior, donde tengo el límite a 1024px?
Ante todo, me gustaría comprender qué es lo que está pasando y por qué no sale como debiera, porque me está volviendo loco...
Espero podais echarme una mano.
Cualquier duda o consulta, por favor, hacedmelo saber.
Un saludo y gracias por adelantado.
