crear una plantilla con css

manel2292 · #1 (**permalink**) 25/01/2012, 05:15

Hola, quiero crear una plantilla así:

para ello el codigo de la hoja de estilos es el siguiente:

Código:

<style>
body
{
margin:0;
}
div#banner
{
width:100%;
height:20;
background-color:yellow;
}
div#a
{
width:20%;
background-color:orange;
}
div#b
{
width:60%;
background-color:green;
}
div#c
{
width:20%;
background-color:orange;
}
div#footer
{
width:100%;
height:20;
background-color:yellow;
}
</style>

sé que me falta poner el atributo position pero no sé como funciona y he leido y echo varias pruebas pero no consigo que funcione.

agradecería que alguien me ayude.

un saludo.

pitufoweb · #2 (**permalink**) 25/01/2012, 07:03

Te recomiendo que leas el capitulo de layout

Saludos

madhatterdef · #3 (**permalink**) 25/01/2012, 07:21

puede que te ayude un poco

<!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" />
<title>Documento sin título</title>
<style type="text/css">
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
}

.header {
background-color: #F00;
height: 200px;
}

.sidebar1 {
float: left;
width: 20%;
background-color: #0F0;
}
.contenido {
width: 60%;
float: left;
background-color: #CCC;
}
.sidebar2 {
float: left;
width: 20%;
background-color: #0F0;
}

.footer {
background-color: #00F;
clear: both;
}
</style>
</head>

<body>
<div class="header">cabezera</div>
<div class="sidebar1">sidebar1</div>
<div class="contenido">contenido </div>
<div class="sidebar2">sidebar2</div>
<div class="footer">footer</div>
</body>
</html>