Foros del Web » Creando para Internet » CSS »

contenedor con tres capas, izquierda, centro y derecha

Estas en el tema de contenedor con tres capas, izquierda, centro y derecha en el foro de CSS en Foros del Web. a ver en html etngo esto: <div id="contenedor"> <div id="cabecera">...</div> <div id="publicidad">...<div> <div id="cuerpo"> <div id="izquierda">....</div> <div id="derecha">....div> div id="centro">...</div> </div> <div id="afiliados2">...</div> <div id="pie">...</div> ...
  #1 (permalink)  
Antiguo 29/10/2005, 03:55
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
contenedor con tres capas, izquierda, centro y derecha

a ver en html etngo esto:

<div id="contenedor">
<div id="cabecera">...</div>

<div id="publicidad">...<div>

<div id="cuerpo">

<div id="izquierda">....</div>
<div id="derecha">....div>
div id="centro">...</div>

</div>

<div id="afiliados2">...</div>

<div id="pie">...</div>

</div>

y en la hoja de estilos esto:

#cuerpo{
background-color: #ffffff;
text-align: center;
margin: auto;
width: 750px;}

#izquierda{
width: 120px;
background-color: #0000ff;
float:left;}

#centro{
margin-left: 120px;
width: 510px;
background-color: #ff0000;
}

#derecha{
width: 120px;
background-color: #00FF00;
float:right;}


con opera me queda perfecto, con explorer me sale el centro abajo, a ver como se puede poner para q salga bein en todas partes, porq he probado varias combinaciones, gracias
  #2 (permalink)  
Antiguo 29/10/2005, 07:02
Avatar de codigoflecha  
Fecha de Ingreso: noviembre-2004
Mensajes: 325
Antigüedad: 13 años, 1 mes
Puntos: 3
para que poner margin-left:120px date cuenta que ese valor en explorer te suma al total de px de las tres capas, prueba a poner float:left
  #3 (permalink)  
Antiguo 29/10/2005, 17:11
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
gracias, ahora se ve perfecto en ambos, muchas gracias ;)
  #4 (permalink)  
Antiguo 29/10/2005, 17:11
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
eso o deja sin un ancho el del centro para que sea elástico.
  #5 (permalink)  
Antiguo 29/10/2005, 17:13
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
centrar contenedor

bueno si visteis el codigo, tengo otro pequeño problema, y es q en explorer, para variar jeje, me sale en un lado (izquierda) mientras q en opera e imagino q en los demas, me sale centrado. decirme q he de añadir, gracias
  #6 (permalink)  
Antiguo 29/10/2005, 17:48
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Cambia tu doctype a xhtml.
  #7 (permalink)  
Antiguo 29/10/2005, 18:20
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
no hay otra manera?

a ver es algo simple no pretendo hacer grandes cosas, solo quiero centrarlo y en otros navegadores se ve perfecto, gracias
  #8 (permalink)  
Antiguo 30/10/2005, 00:27
Avatar de CORE
Usuario no validado
 
Fecha de Ingreso: abril-2002
Ubicación: Merida
Mensajes: 2.165
Antigüedad: 15 años, 8 meses
Puntos: 3
flota todas las capas hacia un mismo lado

saludos
  #9 (permalink)  
Antiguo 30/10/2005, 11:16
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
O a la antigüita
a body ponle text-align: center;
y a tu div contenedor le regresas a text-align: left;
  #10 (permalink)  
Antiguo 30/10/2005, 18:17
Avatar de programeitor  
Fecha de Ingreso: febrero-2005
Mensajes: 994
Antigüedad: 12 años, 10 meses
Puntos: 9
mira a ver si poniendole al <body style="margin:0 auto;">
  #11 (permalink)  
Antiguo 31/10/2005, 03:54
Avatar de xevisoyyo  
Fecha de Ingreso: mayo-2005
Mensajes: 166
Antigüedad: 12 años, 7 meses
Puntos: 1
Gracias a todos

puers ya esta, lo solucione de otra manera, el contenedor lo tenia a 770px asi que lo puse a 100% eso a la cabeza y al pie no me afecta, y como las tres columnas estan dentro del cuerpo, al cual le puse 770px y queda centrado pues ya esta. ahora se me ve perfecto en todos, bueno cambie algo mas pero lo q no podia era centrar el contenedor en explorer, quiza en body se hubiese podido, pero ya no toco mas, gracias a todos

os pongo como me quedo en la hoja de estilos a ver si hay algo innecesario o recomendable q me podais decir, es que aun no lo controlo muy bien, gracias


#contenedor{
text-align:center;
width:100%;
margin:auto;}

#cabecera{}

#publicidad{
text-align: center;
margin: auto;
background-color:#000000;
height:90px;
width: 770px;}

#cuerpo{
background-color: #ffffff;
text-align: center;
margin: auto;
width: 750px;}

#izquierda{
width: 120px;
float:left;}

#centro{
float:left;
width: 510px;}

#derecha{
width: 120px;
float:right;
text-align: right;
border-right-style: solid;
border-right-color: #FFFFFF;}

#saludos{
width: muchos px para todos;}
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 13:36.