Diseño con 3 columnas de diferentes colores

Citar

Escrito el 23 Sep 2007 03:36 am

hola que tal, queriendo crear paginas con capas y css quiero hacer un template el cual tenga los clasicos contenidos (header, foter, left, center y right) pero el center, lef y right tinen diferentes colores. actualmente uso el clear:both; y solo se acomoda el de la capa central :crap:

pero las capas left y right se quedan igual. he visto templates q se ahorran poniendo una imagen de fondo, per me gustaria saber si hay una forma mediante css. les paso mi codigo para que se orienten mejor_

Código :

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>AniRelax</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<link href="estilo.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="contenedor">
   <div id="cabecera"></div>
  
      <div id="left">
         LEFT      </div>
      <div id="center">
            <p>CENTRO</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
         </div>
       <div id="right">RIGHT</div>
  
  <div id="footer">Copyright</div>
</div>
</body>
</html>

y el css es el siguiente:

Código :

body
{
text-align:center;
background-color:#006699;
margin-top:0px;
margin-bottom:0px;
}
#contenedor
{
width:775px;
background:#FFFFFF;
margin: 0 auto; 
}

#cabecera
{
background:#003399;
width:775px;
height:242px;
}
#contenido
{
width:775px
}
#left{
width:151px;
background-color:#4f8d97;
height:auto;
float:left;

}
#center{
height:auto;
width:443px;
background-color:#666666;
float:left;
}
#right
{
height:auto;

width:181px;
background-image:url(../images/bgright.jpg);
background-color:#c8e2e8;
float:right;
}
#footer{
clear:both;
}

si se dan cuenta no bajan las capas laterales, habra una solucion a esto sin usar la imagen de fondo?

gracias, un saludo

Por xbust3r

0 de clabLevel

Envíale un mensaje privado

Citar

Escrito el 29 Sep 2007 02:59 pm

Hmm lo ideal seria que uses una imagen de fondo, no es solo para "ahorrarse problemas" sino que no existe un método real y funcional al 100% para mantener todas las columnas al mismo tamaño, es más ese es su funcionamiento real (que cada uno crezca a su modo).

Por NEO_JP

BOFH