Ver Mensaje Individual
  #1 (permalink)  
Antiguo 30/03/2011, 13:18
Avatar de eMaa
eMaa
 
Fecha de Ingreso: octubre-2008
Mensajes: 223
Antigüedad: 15 años, 6 meses
Puntos: 1
Problema con las 3 columnas

Estoy intentando hacer un header y luego abajo seria a tres columnas pero el problema de que la primera de ellas se va hacia abajo al poner contenido en la del medio (la central). dejo una imagen y el codigo para que se entienda mejor.





como ven al poner contenido en la primera columna la de la izquierda se va hacia abajo, ya probe poniendo overflow hidden a la del centro pero sigue igual

Dejo el code:


Cita:
body {
margin:0;
padding:0;
background: #999;
}
/* Header */
.header {
background:#000;
width: auto;
margin:0px;
height:60px;
border-bottom:#666 solid 10px;
color:#FFF;
padding:0px;
}

.header a:link, a:visited, a:active, a:hover{
text-decoration:none;
color:#FFF;
}

.header .logo{
background:url(logo.png);
width:150px;
height:50px;
float:left;
padding:0px;
position:relative;
}

.header .mensaje{
background:url(mensaje.png);
width:39px;
height:26px;
padding:0px;
position:relative;
left:200px;
}

.header .notificacion{
background: url(notificacion.png) no-repeat;
width:39px;
height:26px;
padding:0px;
position:relative;
left:200px;
}
.header .buscador{
position:relative;
top:-50px;
left:400px;
}

.header .boton-enviar{
background:url(mensaje.png);
}

.header .inicio-registrarse {
width:5px;
height:5px;
padding:0px;
position:relative;
left:700px;
top:-100px;
}

.header .opciones {

}

.header .salir {

}
/* CUERPO */
.cuerpo {
margin:auto;
padding:0px;
width:1000px;
}

.cuerpo-derecha {
float:right;
border-left:solid #666 1px;
height:auto;
margin:0px 0px 0px 0px;
padding:0px 10px 10px 10px;
border-right:solid #666 1px;
width:200px;
text-align:center;
line-height:15px;
background:#FFF;
overflow:hidden;
}

.cuerpo-centro {
width:200px;
margin:0px 0px 0px 350px;
width:300px;
padding:0px 0px 10px 0px;
text-align:center;
line-height:15px;
background:#FFF;
overflow:hidden;
}

.cuerpo-izquierda {
float:left;
border-right:solid #666 1px;
border-left:solid #666 1px;
height:auto;
padding:0px 10px 10px 10px;
margin:-15px 0px 0px 0px;
line-height:15px;
text-align:center;
width:200px;
background:#FFF;
overflow:hidden;
}

.avatar {
background:url(avatar.png) no-repeat;
width:100px;
height:95px;
float:left;
margin:30px 0px 0px 0px;
}

.usuario{
float:right;
margin:50px 0px 0px 0px;
}