Foros del Web » Creando para Internet » CSS »

position - capas: problema con IE6

 Estas en el tema de position - capas: problema con IE6 en el foro de CSS en Foros del Web. Hola a todos, tengo un problema para posicionar unas capas en el IE6 (en el IE7, Firefox, Safari, Opera y hasta el Chrone se ve ...
  #1 (permalink)  
Antiguo 07/11/2008, 11:59
Avatar de chiquirf  
Fecha de Ingreso: noviembre-2005
Ubicación: Madrid
Mensajes: 215
Antigüedad: 19 años
Puntos: 3
position - capas: problema con IE6
Hola a todos, tengo un problema para posicionar unas capas en el IE6 (en el IE7, Firefox, Safari, Opera y hasta el Chrone se ve bien).

Explico mi problema:

Estoy haciendo mi web con capas, de la siguiente manera: ver esquema...

El problema lo tengo con la posición de la capa #2 dentro de la capa "panel-contenido"

el código HTML del panel-contenido es este:
Código PHP:
<div id="panel-contenido">

        <div id="cont-left">&nbsp;</div>
    
        <div id="cont-center">
            <div id="contenido">
                      <p>Aquí va el contenido...!!!</p>
                </div>
        </div>
    
        <div id="cont-right">&nbsp;</div>
        
</div> 
Los estilos son estos:
Código PHP:
#panel-contenido{
    position:relative;
    width:800px;
    min-height:310px;
    border:0px solid #ff0000;
    text-align:center;
    margin:0px;
    padding:0px;
}

        #cont-left {
            position:absolute;
            top:0px;
            left:0px;
            width:10px;
            height:310px;
            background: url(../img/bg-cont-left.png) no-repeat 0px 0px;
            margin:0px;
            padding:0px;
        }
        #cont-center {
            position:relative;
            top:0px;
            left:10px;
            width:780px;
            background: url(../img/bg-cont-center.png) repeat-x 0px 0px #fff;
            margin:0px;
            padding:0px;
        }    
        #cont-right {
            position:absolute;
            top:0px;
            left:790px;
            width:10px;
            height:310px;
            background: url(../img/bg-cont-right.png) no-repeat 0px 0px;
            margin:0px;
            padding:0px;
        } 
El problema es que en IE6 la capa central (#2) se desplaza 10px respecto al lado derecho de la capa izquierda (#1) y no respecto a la esquina sup-izq del panel-contenido (como creo que debe ser)

Es decir, que en vez de que esté a 10px del lateral izquierdo del panel-contenido, está a 20px.

No puedo poner la capa #2 (central) con position:absolute, por que el "panel-fin" se sube a 310px (min-height) de la esquina sup-izq del panel-central en IE7 y Firefox 3, y a 0px en IE6 (¿en IE6 no funciona el min-height verdad??)

Bueno, espero que alguien me haya entendido lo que he querido decir y me pueda echar una mano, jajajaja

Saludos

Carlos
  #2 (permalink)  
Antiguo 07/11/2008, 12:21
Avatar de Mikmoro
Colaborador
  
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 18 años, 1 mes
Puntos: 280
Respuesta: position - capas: problema con IE6
¿Y por qué no lo haces así?:

Cita:
<style type="text/css">
#panel-contenido{
position:relative;
width:800px;
min-height:310px;
border:0px solid #ff0000;
text-align:center;
margin:0px;
padding:0px;
}
#cont-left {width:10px;
float: left;
height:310px;
background: url(../img/bg-cont-left.png) no-repeat 0px 0px;
margin:0px;
padding:0px;
}
#cont-center {background: url(../img/bg-cont-center.png) repeat-x 0px 0px #fff;
margin:0 10px;
padding:0px;
}
#cont-right {width:10px;
float: right;
height:310px;
background: url(../img/bg-cont-right.png) no-repeat 0px 0px;
margin:0px;
padding:0px;
}
</style>
</head>
<body>
<div id="panel-contenido">

<div id="cont-right">&nbsp;</div>
<div id="cont-left">&nbsp;</div>
<div id="cont-center">
<div id="contenido">
<p>Aquí va el contenido...!!!</p>
</div>
</div>

</div>
Soy enemigo de usar las posiciones absolutas cuando no parecen necesarias.

Si de esta forma hace lo que quieres, ese código css se podría economizar.
__________________
Visita mi nueva web idplus.org
  #3 (permalink)  
Antiguo 07/11/2008, 12:23
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 16 años, 1 mes
Puntos: 40
Respuesta: position - capas: problema con IE6
hola chikirf : :

mira, modifique un poco tu codigo, a ver si te sirve:

Código: 
<style type="text/css">
#panel-contenido{width:800px;min-height:310px;text-align:center;margin:0px;padding:0px;} 
#cont-left {float:left;width:10px;height:310px; background: url(../img/bg-cont-left.png) no-repeat 0px 0px;} 
#cont-center {float:left;width:780px; height:auto; display:table; background: url(../img/bg-cont-center.png) repeat-x 0px 0px #fff;}
#cont-right { float:left;width:10px; height:310px;  background: url(../img/bg-cont-right.png) no-repeat 0px 0px; }  
</style>
y el html:

Código HTML:
<div id="panel-contenido"> 

        <div id="cont-left">a</div> 
     
        <div id="cont-center"> 
             <div id="contenido">
                      <p>Aquí va el contenido...!!!</p>
                      <p>&nbsp;</p>
                      <p>&nbsp;</p>
                      <p>&nbsp;</p>
                      <p>&nbsp;</p>
                      <p>&nbsp;</p>
                      <p>&nbsp;</p>
                      <p>&nbsp;</p>
                      <p>&nbsp;</p>
             </div>
        </div> 
     
        <div id="cont-right">a</div> 
         
</div>
con respecto al min_heigth el ie6 no lo respeta pero Mikmoro dió una solución para eso puedes ver http://www.araudi.net

tambien puedes ver esto.

espero te sirva.
  #4 (permalink)  
Antiguo 07/11/2008, 12:39
Avatar de chiquirf  
Fecha de Ingreso: noviembre-2005
Ubicación: Madrid
Mensajes: 215
Antigüedad: 19 años
Puntos: 3
Respuesta: position - capas: problema con IE6
luego de escribir este post, leí el siguiente post: http://www.forosdelweb.com/f53/estab...6/#post2652770
y vi algo que no había probado: poner margin: 0 auto; con esto hice que se viera igual en los 3 navegadores (IE6, IE7y Firefox) luego puse el left:0px a la capa #2 y perfecto...

gracias por sus respuestas, ahora lo pruebo cuando termine de leer esto, que encontré también en el foro

Gracias y Saludos

Carlos
  #5 (permalink)  
Antiguo 07/11/2008, 12:54
Colaborador
  
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 17 años, 5 meses
Puntos: 539
Respuesta: position - capas: problema con IE6
Hola Cro, digo Chiquirf.
Un placer encontrarte por este rincón, y más poder echarte una mano.
Un saludo.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #6 (permalink)  
Antiguo 07/11/2008, 13:08
Avatar de chiquirf  
Fecha de Ingreso: noviembre-2005
Ubicación: Madrid
Mensajes: 215
Antigüedad: 19 años
Puntos: 3
Respuesta: position - capas: problema con IE6
no me digas nada de c r o j a s f, que montaron la de dios por ese post, jajajaja

Nos vemos...
Última edición por chiquirf; 07/11/2008 a las 13:25
  #7 (permalink)  
Antiguo 07/11/2008, 13:13
Colaborador
  
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 17 años, 5 meses
Puntos: 539
Respuesta: position - capas: problema con IE6
Pero pasamos un buen rato hasta que se cerró
Carlos, ahora en serio, me alegra "verte" de nuevo.

Un saludo
P.D.: este foro si lo indexa google, así que mejor edita y borra toda referencia al "usuario que no debe ser nombrado"
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #8 (permalink)  
Antiguo 07/11/2008, 13:26
Avatar de chiquirf  
Fecha de Ingreso: noviembre-2005
Ubicación: Madrid
Mensajes: 215
Antigüedad: 19 años
Puntos: 3
Respuesta: position - capas: problema con IE6
editado esta
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 22:08.