hola gente, estoy tratando de hacer que una capa se superponga a otra. Algo asi:
[URL="http://gabrieled209.aloja2.info/"]http://gabrieled209.aloja2.info/[/URL]
Pero la pagina que se carga en la capa del fondo se ve mal.... deveria verse algo asi:
[URL="http://gabrieled209.aloja2.info/alt/"]http://gabrieled209.aloja2.info/alt/[/URL]
Es decir, el "Panel derecho" que se vea sobre la pagina de fondo como esta en el segundo link.
El CSS del primero es el siguiente:
#pagina {
width:auto;
height:auto;
background-image:url(images/body_bg.jpg);
background-repeat:repeat-x
}
#central {
width:739px;
height:auto;
margin-left:20%;
}
#cabezera {
width:auto;
height:82px;
}
#menu {
width:auto;
height:57px;
}
#contenido {
position:absolute;
z-index:1;
width:auto;
height:auto;
background:url(images/main_tab_bg.jpg);
}
#framecontenido{
position:relative;
z-index:1;
margin-left:2px;
margin-right:2px;
}
#panelderecho {
position:relative;
z-index:2;
height:200px;
width:245px;
border: 1px solid #C00;
left:540px;
top:0px;
}
Y el del segundo es asi:
#pagina {
width:auto;
height:auto;
background-image:url(images/body_bg.jpg);
background-repeat:repeat-x
}
#central {
width:739px;
height:auto;
margin-left:20%;
}
#cabezera {
width:auto;
height:82px;
}
#menu {
width:auto;
height:37px;
}
#contenido {
width:auto;
height:auto;
background:url(images/main_tab_bg.jpg);
}
#framecontenido{
margin-left:2px;
margin-right:2px;
}
#panelderecho {
position:relative;
z-index:2;
height:200px;
width:245px;
border: 1px solid #C00;
left:540px;
top:0px;
}
Por si acaso el codigo del contenido es asi (aunque se puede ver en el codigo fuente):
<div id="pagina">
<div id="central">
<div id="cabezera">
<table cellpadding="0" cellspacing="0">
<tr>
<td width="511">
<h1>Logo</h1>
</td>
<td width="67">
<h3>Vacio</h3>
</td>
<td width="77">
<h3>Home</h3>
</td>
<td width="84">
<h3>Boton</h3>
</td>
</tr>
</table>
</div>
<div id="menu">
<table cellpadding="0" cellspacing="0">
<tr>
<td width="140" align="center">
<img src="images/menu-inicio 01.jpg" name='inicioIMG' width="140" border="0">
</td>
<td width="126" align="center">
<img src="images/menu-servicios 01.jpg" name="serviciosIMG" width="126" border="0">
</td>
<td width="134" align="center">
<img src="images/menu-estructura 01.jpg" name="estructuraIMG" width="134" border="0">
</td>
<td width="152" align="center">
<img src="images/menu-consultas 01.jpg" name="consultasIMG" width="152" border="0">
</td>
<td width="187" align="center">
<img src="images/menu-sobrenosotros 01.jpg" name="sobrenosotrosIMG" width="187" border="0">
</td>
</tr>
</table>
</div>
<div id="contenido">
<div id="framecontenido"></div>
</div>
<div id="panelderecho">
<h1>Panel derecho</h1>
</div>
</div>
</div>
Espero puedan ayudarme, saludos!