Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/03/2013, 11:32
Usersito
 
Fecha de Ingreso: marzo-2013
Mensajes: 3
Antigüedad: 11 años, 8 meses
Puntos: 0
¿Me ayudáis a terminar de maquetar esta pequeña web?

Hola a todos/as.

Estoy intentando hacer una pequeña pagina web y sinceramente, llevo varios días liado con ella. Hasta ahora he logrado hacer gran parte, pero llevo toda la tarde con un pequeño problema que no logro solucionar.

He creado la cabecera y he metido dentro un logo y una imagen (con las medidas de la futura publicidad que pondré en su lugar).
Debajo he creado otra capa con otra imagen que será enlaces de adsense
Debajo de esta quería crear 3 columnas, una para el menu, otra para el contenido y la derecha para otra publicidad.
Finalmente, debajo del todo, pero sin separación, un pie de página.

Me he quedado trabado en las 3 columnas, pues sale una a la izquierda, el contenido en el centro y a la derecha la del banner, pero más abajo. El pié también ha salido mezclado en ese cacao. No se como seguir con el código y la verdad es que estoy un poco cansado de tanto mirar la pantalla. Llevo desde esta mañana. Es lo que tiene no saber mucho de esto.

Os dejo los códigos que tengo hasta el momento, haber si podéis ayudarme un poco. Notareis que he puesto borde en las capas, es para poder orientarme, después los quitaré.

Gracias de antemano.

Namaste.


Código:
<!DOCTYPE HTML>
<html lang="es-es">
<head>
<meta charset="UTF-8"/>
<title></title>
<link rel="stylesheet" href="estilo.css"/>
</head>
<body>
<div id="contenedor">
	<div id="cabecera">
		<div id="logo"><img src="img/logo.jpg"/></div>
		<div id="bannercabecera"><img src="temp/banner_display_468_60.png"/></div>	
	</div>
	<div id="enlacescabecera">
		<center><img src="temp/enlaces_728_15.png"/></center>
	</div>
	<div id="cuerpo">
		<div id="menuizquierdo">menuizquierdo</div>
		<div id="contenido">contenido</div>
		<div id="bannerderecho">bannerderecho</div>	
	</div>
</div>
<div id="pie">pie</div>
</body>
</html>
Código:
body
{
margin-top: 0px;
margin-left: 0px;
background-color: #0174DF;
background-image: url(img/fondo.png)
}

#contenedor
{
/*background-color: #ffffff;*/
width: 100%;
min-width: 900px;
}

#cabecera
{
background-color: #ffffff;
width: 900px;
height: 121px;
margin: auto;
}

#logo
{
margin-top: 4px;
width: 340px;
height: 113px;
margin-left: 25px;
float: left;
}

#bannercabecera
{
float: right;
margin-top: 25px;
margin-right: 25px;
}


#enlacescabecera
{
background-color: #ffffff;
padding-top: 5px;
margin: auto;
width: 900px;
}

#cuerpo
{
width: 900px;
margin: auto;
background-color: #ffffff;
border-color: #000000;
border-width: 1px;
border-style: solid;
}

#menuizquierdo
{
float: left;
width: 200px;
border-color: #000000;
border-width: 1px;
border-style: solid;
}

#contenido
{
width: 500px;
border-color: #000000;
border-width: 1px;
border-style: solid;
}

#bannerderecho
{
float: right;
width: 200px;
border-color: #000000;
border-width: 1px;
border-style: solid;
}

#pie
{
width: 900px;
margin: auto;
background-color: #ffffff;
}