volviendome loco con divs y IE6

[ferranWEB]

buenas,

he leido que mucha gente se ha encontrado con el mismo problema que yo, aunque todo lo que he probado nada ha funcionado.

tengo definidas divs dentro de divs, tal que asi:

#contenido_lista #lista.....

#contenido_productos #productos

y en ordenadores con IE6 se me ponen las divs unas encimas de otras. hay alguna forma de hacer algo??

os dejo el codigo

[STYLE]

/* elementos comunes */

HTML, BODY {height:100%; margin:0;}
BODY {background-color:#261d20; position:relative; min-width:965px; min-height:650px; font-family:"Arial", Tahoma, Arial; color:#261d21;}
IMG {border:0;}

#web {position:absolute; left:50%; margin-left:-483px; top:50%; margin-top:-325px; width:965px; height:650px; background-image:url('../img/fondo.gif');}
#web_sup {position:absolute; left:50%; margin-left:-483px; top:50%; margin-top:-325px; width:965px; height:12px; background-image:url('../img/fondo_sup.gif'); background-color:#fff;}
#web_cen {position:relative; top:12px; left:0; width:965px; height:627px; background-image:url('../img/fondo_cen.gif'); background-color:#fff;}

#menu_superior {position:absolute; left:190px; top:17px; height:20px; font-size:14px; line-height:120%;}
#menu_superior a {text-decoration:underline; color:#261d21;}

#logo_superior {position:absolute; left:10px; top:8px; height:20px; font-size:14px; line-height:120%;}

#leyendas {position:absolute; left:-140px; top:495px; height:20px; font-size:13px; line-height:120%;}

#menu_izquierda {position:absolute; left:0; top:56px; width:177px; font-size:8px; line-height:100%;}

#menu_izquierdaAdmin {position:absolute; left:0; top:56px; width:177px; font-size:12px; line-height:100%;}

#menu_izquierda .submenu {
position:relative;
top:4px;
left:27px;
font-size: 14px;
}
#menu_izquierda .submenuAdmin {
position:relative;
top:4px;
left:27px;
font-size: 12px;
}
#menu_izquierda #capa_denominaciones {position:relative; left:5px; top:5px; width:172px; height:47px; background-image:url('../img/denominaciones.gif');}
#menu_izquierda #capa_bodegas {position:relative; left:5px; top:5px; width:172px; height:46px; background-image:url('../img/bodegas.gif');}
#menu_izquierda #capa_productos {position:relative; left:5px; top:5px; width:172px; height:46px; background-image:url('../img/productos.gif');}
#menu_izquierda #capa_lotes {position:relative; left:5px; top:10px; width:172px; height:46px; background-image:url('../img/lotes.gif');}
#menu_izquierda select {position:absolute; left:7px; top:19px; font-family:Tahoma, Arial; color:#656565; font-size:11px; width:165px;}

#pie {position:absolute; left:105px; bottom:5px; width:860px; text-align:center; font-family:Tahoma, Arial; color:#615659; font-size:11px; line-height:120%;}
#pie a {color:#231b1e;}

#pie_flotante {position:absolute; left:0; bottom:-15px; width:965px; height:20px; text-align:center; font-family:Tahoma, Arial; color:#615659; font-size:11px; line-height:120%; background:url('../img/fondo_inf.gif');}
#pie_flotante a {color:#231b1e;}


/* HOME */

#menu_derecha {position:absolute; left:822px; top:44px; width:128px; height:530px;}
#menu_derecha .subtitulo {height:20px; text-align:center; background-color:#e8dcc7; font-family:"Arial-bold", Tahoma, Arial; font-weight:bold; font-size:11px;}
#menu_derecha .subtitulo a {text-decoration:none; color:#261d21;}

#contenido_home {
position:absolute;
left:190px;
top:40px;
width:610px;
height:588px;
font-size: 10px;
}


/* LISTA DE PRODUCTOS, INFO */

#contenido_lista {position:absolute; left:190px; top:40px; width:425px; font-size:11px; line-height:120%;}
#contenido_lista img {display:block;}
#contenido_lista a {color:#666;}
#contenido_lista .tachado {text-decoration:line-through;}

#menu_inferior {position:absolute; left:183px; top:599px; width:778px; height:29px; background-image:url('../img/min_fondo.gif'); font-size:14px; line-height:100%;}
#menu_inferior #links {position:absolute; left:38px; top:10px;}

#menu_inferior_flotante {position:relative; left:-438px; top:500px; width:778px; height:29px; background-image:url('../img/min_fondo.gif'); font-size:14px; line-height:100%; margin-right:-300px;}
#menu_inferior_flotante #links {position:absolute; left:38px; top:10px;}

#carrito {position:absolute; top:40px; right:7px; width:337px; font-family:Tahoma, Arial; font-size:12px; line-height:120%;}
#carrito table thead tr {height:42px;}
#carrito table thead td {background-image:url('../img/carrito_encabezado.gif');}
table .fila1 {background-color:#eee8c0;}
table .fila2 {background-color:#e7d6a2;}
#carrito table input {position:relative; top:-2px; width:15px; text-align:right; font-family:Tahoma, Arial; font-size:12px; line-height:100%;}
#carrito table .iva {font-size:10px;}
#carrito table tfoot tr {height:28px;}
#carrito table tfoot td {background-image:url('../img/carrito_pie.gif'); font-weight:bold; color:#fff;}
#carrito table tfoot .precio {font-size:16px;}
#carrito table tfoot img {position:relative; top:2px;}

/* INFO */

#contenido_lista #ficha {font-size:14px; line-height:120%;}
#contenido_lista #ficha {font-family:"-regular", Tahoma, Arial; font-size:14px; line-height:100%;}
#contenido_lista #ficha {position:absolute; top:0; left:150px; width:270px; height:400px;}
#contenido_lista #ficha table td {text-align:left;}
#contenido_lista #ficha thead td {color:#fff; background-color:#261d20;}
#contenido_lista #ficha thead .encabezado {background-image:url('../img/info_encabezado.gif');}
#contenido_lista #ficha .nombre {font-family: "Arial-bold", Tahoma, Arial; font-size:20px; line-height:100%;}
#contenido_lista #ficha tfoot td {color:#caa82d; background-color:#261d20; font-weight:bold;}
#contenido_lista #ficha tfoot .pie {background-image:url('../img/info_pie.gif');}
#contenido_lista #ficha tfoot .precio {font-size:18px; font-weight:normal;}


#contenido_lista #foto {position:absolute; top:0px; left:0px; width:140px; height:400px;}

#contenido_lista #anadir {position:relative; top:10px; left:-130px; width:390px; height:79px; background-image:url('../img/info_fondoanadir.gif');}
#contenido_lista #anadir #anadir1 {position:absolute; left:5px; top:5px;}
#contenido_lista #anadir #anadir2 {position:absolute; left:5px; top:35px;}
#contenido_lista #anadir #fotobodega {position:absolute; right:5px; top:5px;}



/* INFO LOTES*/

#contenido_lista #ficha2 {font-size:14px; line-height:120%;}
#contenido_lista #ficha2 {font-family:"-regular", Tahoma, Arial; font-size:14px; line-height:100%;}
#contenido_lista #ficha2 {
position:absolute;
width:270px;
height:400px;
}
#contenido_lista #ficha2 table td {text-align:left;}
#contenido_lista #ficha2 thead td {color:#fff; background-color:#261d20;}
#contenido_lista #ficha2 thead .encabezado {background-image:url('../img/info_encabezado_lote.gif');}
#contenido_lista #ficha2 .nombre {font-family: "Arial-bold", Tahoma, Arial; font-size:16px; line-height:100%;padding-left: 10px}
#contenido_lista #ficha2 tfoot td {color:#caa82d; background-color:#261d20; font-weight:bold;}
table .fila1 {background-color:#eee8c0;}
table .fila2 {background-color:#e7d6a2;}
#contenido_lista #ficha2 tfoot .pie {background-image:url('../img/info_pie_lote.gif');}
#contenido_lista #ficha2 tfoot .precio {font-size:18px; font-weight:normal;}


/* COMPRAR */

#carrito_final {
position:absolute;
top:57px;
left:200px;
width:640px;
font-family:Tahoma, Arial;
font-size:12px;
line-height:120%;
}
#carrito_final table thead tr {height:42px;}
#carrito_final table thead td {background-image:url('../img/carrito_encabezado650.gif');}
table .fila1 {background-color:#eee8c0;}
table .fila2 {background-color:#e7d6a2;}
#carrito_final table .cantidad {position:relative; top:-2px; width:15px; text-align:right; font-family:Tahoma, Arial; font-size:12px; line-height:100%;}
#carrito_final table .iva {font-size:10px;}
#carrito_final table tfoot tr {height:28px;}
#carrito_final table tfoot td {background-image:url('../img/carrito_pie650.gif'); font-weight:bold; color:#fff;}
#carrito_final table tfoot .precio {font-size:16px;}
#carrito_final table tfoot img {position:relative; top:2px;}
#carrito_final img {display:inline;}

#carrito_final #menu_inferior_flotante {position:relative; left:-16px; top:500px; width:778px; height:29px; background-image:url('../img/min_fondo.gif'); font-size:14px; line-height:100%; margin-right:-300px;}
#carrito_final #menu_inferior_flotante #links {position:absolute; left:38px; top:10px;}

[/STYLE]
saludos

[cristian_cena]

Pregunto ¿Es necesario que hagas esto?
#contenido_lista #ficha2 tfoot .precio
o en su lugar basta con poner solamente
.precio
Me ha ocurrido lo que a ti y lo solucioné eliminando el anidamiento de "id" en los estilos. Fuí incluyendo esa anidación a través de tabulaciones en el código css. ej:
#contenido_lista {
prop:valor;
}
aaaaa#ficha2 {
aaaaaprop:valor;
aaaaa}
aaaaaaaaaa.precio{
aaaaaaaaaaprop:valor;
aaaaaaaaaa} /*esas "a" son porque no puedo tabular aquí*/

Espero te sirva, y la verdad también tengo la duda de porque presentan este problema los selectores id.
Nos vemos

[kseso?]

Hola Cristian:
No conozco problemas de ie6 con el grado de especificidad de las declaraciones en el css:

Código css:

#identificador .clase1 .clase2 .clase3 {...}
 

otra cosa muy distinta es el aplicar las reglas de varias declaraciones a una etiqueta en el html:

Código html:

<div class="clase1 clase2 clase3>...
 

en este caso sí hay problemas, pero como no vemos su html...

Un saludo

[cristian_cena]

El problema que se me presentaba a mi, (trabajando en joomla, aunque me parece que no cambia la cosa) era que cuando anidaba los selectores,luego no me tomaba los estilos (en ningun navegador), por lo que, en su momento, opte por no anidarlos más.
Aunque ahora pruebo y funciona por lo que habrá sido cuestión de esperar a que cargue el servidor, o de actualizar la caché, (o de pulsar F5 )

y aprovechaba el hilo para intrometerme a ver si por ahi no pasaba algo raro con el anidamiento de selectores.

Gracias kseso?

[ferranWEB]

buenas compis

gracias por vuestras respuestas.

el texto html es muy extenso, pero pondre un pequeño trozo donde aparece como llamo a los selectores del div:

Código HTML:

<div id="contenido_lista">
	<div id="ficha">
    <table cellpadding="0" cellspacing="0" width="260">
			<thead>.......

<tr height="72" class="fila1">.... y fila2...

<div id="anadir">
<div id="anadir1">....

tengo un contenido lista central y dentro voy metiendo las diferentes capas, por ese motivo llamo a #contenido_lista #ficha...

alguna sugerencia?

saludos