#1 [DREAMWEAVER] Alineacion de capas
Estimados amigos del foro:
He diseñado una pagina Web con capas, y una de ellas "Contenido" tiene dentro de si otras tres capas: "Navegacion", "Definicion" y "Panel Derecho" con porcentajes de ancho de 20%, 60% y 20% respectivamente.
La pagina se visualiza bien en Firefox, pero cuando la abro en IE, la capa "PAnel Derecho" aparece a la izquierda y debajo de "Navegacion".
Quiero ver si pueden ayudarme a encontrar mi error.
Aqui dejo el codigo.- De antemano muchas gracias ---<--@
--------------------------------------------
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;
}
He diseñado una pagina Web con capas, y una de ellas "Contenido" tiene dentro de si otras tres capas: "Navegacion", "Definicion" y "Panel Derecho" con porcentajes de ancho de 20%, 60% y 20% respectivamente.
La pagina se visualiza bien en Firefox, pero cuando la abro en IE, la capa "PAnel Derecho" aparece a la izquierda y debajo de "Navegacion".
Quiero ver si pueden ayudarme a encontrar mi error.
Aqui dejo el codigo.- De antemano muchas gracias ---<--@
--------------------------------------------
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;
}
0
