hola mios tengo maquetado en esta pagina una pagina y el asutno es q quiero q el footer rrecorra deacuerdo al contenedor principal pero no lo hace se queda estatico no se que hacer ahora lo pongo el maquetad y el css, de antemano les gardezdo por susrespuestas espero puedan ayudarme no se q esta sucediendo ene l css.
Código HTML:
<?php
// no direct access
defined( '_JEXEC' ) or die( 'Restricted access' );?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
<jdoc:include type="head" />
<?php if ( $my->id ) { initEditor(); } ?>
<link rel="stylesheet" href="<?php echo $this->baseurl ;?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ;?>/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/plantilla/css/template.css" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<title>titulo</title>
<body>
<div id="cuerpo">
<jdoc:include type="modules" name="cuerpo" style="xhtml"/>
<div id="search">
<jdoc:include type="modules" name="buscar" style="xhtml"/>
</div><!-- FIN!-->
<div id="header">
<h1 class="logo">EQUIPOS<br />
DE MEDICIÓN Y CONTROL DE CALIDAD</h1>
</div><!-- FIN-->
<!-- FIN LOGO CABECERA Y BUSCADOR!-->
<div id="contenedor_principal">
<jdoc:include type="component" />
<!-- Comienzo Contenedor fondo de cuadros -->
<div id="cuadros"> </div>
<!-- Fin Contenedor cuadros -->
<!-- Comienzo contenidor1 -->
<div align="center" id="laboratorio">
<jdoc:include type="modules" name="laboratorio" style="xhtml" />
</div><!-- Fin contenidor1 -->
<!-- Comienzo contenidor2 -->
<div id="ganaderia">
<jdoc:include type="modules" name="ganaderia" style="xhtml" />
</div><!-- Fin contenidor2 -->
<!-- Comienzo contenidor3 -->
<div id="industria">
<jdoc:include type="modules" name="industria" style="xhtml" />
</div><!-- Fin contenidor3 -->
<!-- Comienzo contenidor4 -->
<div id="agricultura">
<jdoc:include type="modules" name="agricultura" style="xhtml" />
</div><!-- Fin contenidor4 -->
<!-- Comienzo contenidor5 -->
<div id="invernaderos">
<jdoc:include type="modules" name="invernaderos" style="xhtml" />
</div><!-- Fin contenidor5 -->
</div><!-- Fin contenidor_principal-->
<!--inicio pie -->
<div id="pie">
PIE.....
</div><!-- Fin pie-->
</div><!-- Fin cuerpo-->
</body>
</html> y css
Código:
body {
font-size: 99%;
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
color: #000;
width:99%;
overflow:auto;
background:url(../../miplantilla/images/background.jpg);
}
h1.logo a {
width: 300px;
display: block;
background: url(../images/logo.png) no-repeat;
height: 80px;
position: relative;
z-index: 100;
left: 352px;
margin-top:-19px;
}
////////////////////////*/
#header{
width:99%;
float:left;
position:relative;
text-align:center;
}
/*CUADROS VERDES*/
#cuadros{
position:absolute;
top: 150px;
float:left;
z-index: 0;
width: 607px;
height: 453px;
background: url(../images/cuadros.png) no-repeat;
margin-left:120px;
}
#contenedor_principal{
height:380px;
float:left;
margin-left:20px;
margin-right:20px;
width:98%;
}
#laboratorio {
clear:both;
position: absolute;
left: 129px;
top: 179px;
z-index: 4;
width: 172px;
height: 243px;
}
#ganaderia {
position: absolute;
left: 274px;
top: 320px;
z-index: 4;
width: 227px;
height: 184px;
}
#industria {
position: absolute;
left: 331px;
top: 153px;
z-index: 5;
width: 251px;
height: 201px;
}
#agricultura {
position:absolute;
left: 639px;
top: 145px;
z-index: 6;
width:250px;
height:202px;
}
#invernaderos {
position:absolute;
left: 505px;
top: 307px;
z-index:4;
width:272px;
height:180px;
}
#pie{
position:relative;
width:99%;
float:left;
clear:both;
}