Foros del Web » Creando para Internet » CSS »

En un capa que contiene 3 capas, la ultima no queda bien

Estas en el tema de En un capa que contiene 3 capas, la ultima no queda bien en el foro de CSS en Foros del Web. Estimados amigos del Foro: He diseñado una estructura basica con capas, donde la capa "Contenido" tiene dentro a las capas "Navegacion", "Definicion" y "Panel Derecho", ...
  #1 (permalink)  
Antiguo 20/05/2008, 09:15
 
Fecha de Ingreso: mayo-2008
Mensajes: 4
Antigüedad: 9 años, 6 meses
Puntos: 0
En un capa que contiene 3 capas, la ultima no queda bien

Estimados amigos del Foro:

He diseñado una estructura basica con capas, donde la capa "Contenido" tiene dentro a las capas "Navegacion", "Definicion" y "Panel Derecho", a las cuales les corresponden los porcentajes 20%, 60% y 20% respectivamente.

Cuando visualizo la pagina en Firefox, se ve como la quiero.- sin embargo, en IE, la tercer capa ("Panel Derecho") lo coloca debajo de la primer capa ("Navegacion").

He modificado los porcentajes, lo he hecho con pixeles fijos (que no lo quiero asi, por cierto) y no mas no se deja.

Podrian echarme una mano?

Aqui dejo el codigo.

De antemano, muchas gracias por su ayuda

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PAGINA
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="estilo_general.css" rel="stylesheet" type="text/css" />
<title>Index</title>
<LINK REL="SHORTCUT ICON" HREF="imagenes/icono.gif">
</head>

<body>
<div id="global">
<div id="cabecera">
</div><!--Cierra cabecera-->
<div id="barra">
</div><!--Cierra barra-->
<div id="Contenido">
<div align="left" id="navegacion">
</div><!--Cierra navegacion-->
<div id="definicion">
</div><!--Cierra definicion-->
<div id="panel_derecho">
</div><!--Cierra panel_derecho-->
</div><!--Cierra contenido-->
<div id="pie">Fecha de Ultima actualizacion:
<!-- #BeginDate format:Sw1a -->19 Mayo, 2008 2:33 PM<!-- #EndDate --></div>
</div><!--Cierra global-->
</body>
</html>

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
HOJA DE ESTILOS
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
@charset "utf-8";

* {
font-family: Georgia, "Times New Roman", Times, serif;
margin: 0px 0px 0px 0px;
padding: 0px;
border: none;
}

#global {
width: 98%;
height: 768px;
margin: 0px 0px 0px 0px;
padding: 0px;
border: none;

}

#cabecera {
width: 98%;
height: 120px;
margin: 0px 0px 0px 0px;
padding: 0px;
border: none;

background-color:#000066;
}

#barra {
width: 98%;
height:20px;
margin:0px 0px 0px 0px;
padding: 0px;
border: none;

background-color:#FF0000;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12pt;
color:#CCCCCC;
}

#Contenido{
width: 98%;
height: *;
margin:0px 0px 0px 0px;
padding: 0px;
border: none;
clear: right;
font-family: Georgia, "Times New Roman", Times, serif;
font-size:12px;
color:#000066;
text-align:justify;
}

#navegacion {
width: 20%;
height: 500px;
margin: 0px 0px 0px 0px;
padding: 0px;
border:none;
float:left;
background-color:#E1E1E1;
}

#definicion {
width: 60%;
height: 499px;
margin:0px 0px 0px 0px;
padding: 0px;
border:none;
float: left;
background-color: #FFFFFF;
}

#panel_derecho {
width: 20%;
height: 500px;
margin: 0px 0px 0px 0px;
padding: 0px;
border:none;
float: left;
background-color: #E1E1E1;
clear: inherit;
}

#pie {
width: 98%;
height: 25px;
float: left;
background-color: #000066;
color: #999999;
font-size:10px;
text-align:center;
}

  #2 (permalink)  
Antiguo 20/05/2008, 11:31
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: En un capa que contiene 3 capas, la ultima no queda bien

Si no mal recuerdo, IE tiene un pequeño defecto en la suma de porcentajes. Intenta hace el de enmedio un poco más pequeño, creo que 59% servirá, si no, quizá un poco menos... Si esto lo resuelve, veremos como optimizarlo, en caso contrario, habría que ver otra posibilidad. Suerte!
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #3 (permalink)  
Antiguo 20/05/2008, 14:08
 
Fecha de Ingreso: mayo-2008
Mensajes: 4
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: En un capa que contiene 3 capas, la ultima no queda bien

Cita:
Iniciado por daPhyre Ver Mensaje
Si no mal recuerdo, IE tiene un pequeño defecto en la suma de porcentajes. Intenta hace el de enmedio un poco más pequeño, creo que 59% servirá, si no, quizá un poco menos... Si esto lo resuelve, veremos como optimizarlo, en caso contrario, habría que ver otra posibilidad. Suerte!
Estimado DPhyre:

Si, con 59% sí que funciona.
Yo pense que habia indicado algo mal en el codigo, no pense que fuera un error propio del IE.
Se nota un poco el desfase, pero creo que es tolerable.

Muchisimas gracias por tu pronta ayuda.

Sinceramente
  #4 (permalink)  
Antiguo 21/05/2008, 10:16
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: En un capa que contiene 3 capas, la ultima no queda bien

Si, ¿Por qué crees que todos nosotros los desarrolladores web adoramos tanto a IE? XD

Me alegro haber podido ayudar. Ahora, creo que hay una forma de que sea 60% para todos los exploradores, y diferente para IE, para que no se vea mal el los demás por culpa de IE:

#definicion {
width: 60% !important;
width: 59%;

Según se, el important significa que ninguna otra instrucción cambie eso que has indicado, pero extrañamente (Y para fortuna nuestra) IE no lo reconoce... Con eso podrás hacer que ajustarlo para IE no afecte la presentación de tu pagina en otros navegadores. Ojalá te sirva. Suerte!
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #5 (permalink)  
Antiguo 21/05/2008, 11:21
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: En un capa que contiene 3 capas, la ultima no queda bien

Y como de costumbre, hay una solución mejor:

primero se pone el panel derecho con el 20%, luego el izquierdo con el 20% y luego el central sin tamaño. Queda perfecto.

Mikel.
  #6 (permalink)  
Antiguo 21/05/2008, 11:23
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: En un capa que contiene 3 capas, la ultima no queda bien

Cita:
Iniciado por Mikmoro Ver Mensaje
Y como de costumbre, hay una solución mejor:

primero se pone el panel derecho con el 20%, luego el izquierdo con el 20% y luego el central sin tamaño. Queda perfecto.

Mikel.
¿Y como es que vine a olvidar esto si es lo que yo hago? ¬¬'
(Quizá por que lo hago inconcientemente)

Gracias Mikel por recordarnoslo =P'
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #7 (permalink)  
Antiguo 21/05/2008, 14:17
 
Fecha de Ingreso: mayo-2008
Mensajes: 4
Antigüedad: 9 años, 6 meses
Puntos: 0
De acuerdo Respuesta: En un capa que contiene 3 capas, la ultima no queda bien

Cita:
Iniciado por daPhyre Ver Mensaje
¿Y como es que vine a olvidar esto si es lo que yo hago? ¬¬'
(Quizá por que lo hago inconcientemente)

Gracias Mikel por recordarnoslo =P'
Muchas gracias a ambos por la respuestas.
Ya probe esa nueva forma, y claro, funciona.

Gracias de nuevo a ambos
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

SíEste tema le ha gustado a 2 personas




La zona horaria es GMT -6. Ahora son las 13:55.