Se desaparece parte del fondo de una caja en IE

[[ EDO ]]

Que tal señores

Estoy haciendo en sitio por completo en CSS, despues de investigar/experimentar un poco encontré la manera de hacer columnas y al parecer di con la forma correcta de hacerlas, al menos para este caso:

http://www.flash-vortex.com/vidavita..._las_manos.htm

Cuando revisen el sitio verán que el menú de la izquierda representa la columna de ese lado y el texto párrafo, la columna derecha.
Todo está ok y he conseguido el resultado que deseaba. Pero; al visualizar la página en IE 6 desaparece el fondo de la columna derecha, dicho fondo es simple GIF. Si se toman la molestia de seleccionar el texto que esta sobre el área donde desapaerció el fondo, verán que tiende a aparecer de a pedacitos debajo de las lineas de texto.
Seguramente, como es sabido que Explorer no soporta del todo las CSS y de paso no respeta los estandares mismos, tiene problemas con el renderizado de estas en la pantalla.
Acá les dejo el código de ambas columnas para que lo vean, pero no creo que esté mal construido puesto que las cajas y elementos fluyen correctamente de la página, sólo desaparecen los gráficos de fondo.

Columna izquierda:

#submenu {
font-family: "Trebuchet MS", Verdana, Arial;
width: 220px;
float: left;
position: relative;
margin: 0;
clear: left;
}

Coloumna derecha:

#contenidoDerecha {
margin-left: 220px;
background-image: url(imagenes/fondo-columna-derecha.gif);
padding-right: 30px;
padding-left: 15px;
margin-top: 0px;
padding-top: 0px;
clear: right;
}

Y todo el documento CSS aquí:

http://www.flash-vortex.com/vidavital/estilos.css

Demás está decir que sería bueno que revisaran la página con Firefox y Opera para que comparen.

Saludos

[juanchilo]

mira en primer lugar quita los parrafos vacios que veo aqui:


<span class="titulo">El secreto está en las manos </span>


<p class="bajadaTitulo-01">&nbsp;</p>

<p class="bajadaTitulo-01">Un
movimiento preciso basta para alinear vértebras desviadas y así
resolver desde fijaciones musculares hasta cefaleas, con una técnica
que a pesar de sus años recién empieza a ser regulada.
</p>

<p class="bajadaTitulo-01">&nbsp;</p>

porque eso es inecesario, si quieres darle espacio a ese parrafo aplicale al estilo un padding como este:

Código HTML:

.bajadaTitulo-01 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 19px;
	color: #999999;
	line-height: 25px;
	text-align: right;
	padding: 2em 0 2em 0;  /* hablo de estoo !!! */ 
}

luego prueba a ver como se ve... creo que por ahi puede venir el error

[juanchilo]

tambien lo correcto seria que en lugar de usar <span> para el titulo utilices un header :

cambiando esto...

<span class="titulo">El secreto está en las manos </span>

por esto...

<h1>El secreto está en las manos </h1>

pero eso queda a tu criterio si quieres respetar el XHTML como se debe.

saludos

[[ EDO ]]

Bueno, lo primero es agradecerles sus respuestas, pero sucede que el error no está en el código y tampoco en la aplicación de las clases, o en los parrafos vacios, o en las etiquetas, etc. Es simplemente un maldito BUG de Explorer (otro más). Pueden verificar que el error no está en mi código al ver la misma página pero vacía a la derecha:

http://flash-vortex.com/vidavital/areas.htm

Buscando por los confines de la Internet encontré la solución; una señorita en su weblog publicó que basada en su experiancia, había determinado que la solución a casi todos los males de IE+CSS es position: relative. Ni ella misma tiene una lógica para su teoría, pero como la cuestión no es más que agregar una línea de código, probé el supuesto antídoto ¿y qué creen?...

...FUNCIONÓ

Ahora sólo me aparece una línea de 1 píxel en la parte superior de la DIV (que luego arreglaré) y en Dreamweaver se ve un poco desarmada la diagramación, pero es mejor que un pedazo de fondo faltante.

Acá les dejo el link con el weblog:

http://www.estherfuldauer.com/2005/0...s-los-bugs-ie/

Dicen que Explorer 7 se ajustará más a los estándares y esperemos que así sea.

Saludos

[RoQ]

aparte de lo que te dijo juanchillo creo que se trata del peekaboo

[juanchilo]

alguna vez cai en las "garras" del pekaboo lo solucione con clear:both;

Dicen que Explorer 7 se ajustará más a los estándares y esperemos que así sea.

se dicen tantas cosas en Gates company pero se hacen tan pocas para bien de los estandares.

un saludo

[[ EDO ]]

Traté de arreglaro con clear:both, pero no dio resultado; de hecho me desarmó todo. Por ahí lei sobre el peekaboo y al parecer el conflicto en mi caso es similar si es que no el mismo. Sin embargo no lo pude solucionar con los remedios que decían algunos sitios, sólo position: relative funcionó. Seguramante muchos bugs tienen un mismo origen en el motor del Explorer.

Gracias una ves más por la info.