Foros del Web » Creando para Internet » CSS »

3 columnas... y me baja una ¿por qué?

Estas en el tema de 3 columnas... y me baja una ¿por qué? en el foro de CSS en Foros del Web. Hola, hago 3 columnas definidas así: (bloquecontenido integra menuizquierda, contenidoprincipal1 y contenidoderecha1) #bloquecontenido{ text-align: left; width: 620px; margin: auto; } #menuizquierda{ left:5px; background-color: $EFE; width:75px; ...
  #1 (permalink)  
Antiguo 09/03/2007, 03:36
Usuario no validado
 
Fecha de Ingreso: marzo-2004
Mensajes: 349
Antigüedad: 13 años, 8 meses
Puntos: 0
3 columnas... y me baja una ¿por qué?

Hola, hago 3 columnas definidas así: (bloquecontenido integra menuizquierda, contenidoprincipal1 y contenidoderecha1)

#bloquecontenido{
text-align: left;
width: 620px;
margin: auto;
}

#menuizquierda{
left:5px;
background-color: $EFE;
width:75px;
float:left
}

#contenidoprincipal1{
margin-left:80 px;
color: black;
width:350px
}


#contenidoderecha1{
margin-left:380 px;
width: 145 px;
float: right;
}


Luego lo llamo con DIV ID (primero contenedor que se cierra englobando a las otras 3). Pero la primera y la segunda columna me salen bien, y la tercera me la pone debajo en altura de las otras... ¿qué puede ser?
  #2 (permalink)  
Antiguo 09/03/2007, 03:46
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Re: 3 columnas... y me baja una ¿por qué?

Hola JBRS

#contenidoprincipal1{
margin-left:80 px;

Entre el ancho de cada columna y el margen que le has puesto a contenidoprincipal1, no caben las 3 en el contenedor, por eso una se pasa a la siguiente línea.

Saludos,
  #3 (permalink)  
Antiguo 09/03/2007, 04:01
Usuario no validado
 
Fecha de Ingreso: marzo-2004
Mensajes: 349
Antigüedad: 13 años, 8 meses
Puntos: 0
Re: 3 columnas... y me baja una ¿por qué?

Pues debe haber algo más... quitandolos tampoco me cabe. Y pongo ese margen para que no se tire encima de la columna de la izquierda cuando esta acaba, por el float... ¿no hay una forma de hacer 3 columnas más sencilla y cuya división respete, sin floats ni historias?
  #4 (permalink)  
Antiguo 09/03/2007, 04:55
Usuario no validado
 
Fecha de Ingreso: marzo-2004
Mensajes: 349
Antigüedad: 13 años, 8 meses
Puntos: 0
Re: 3 columnas... y me baja una ¿por qué?

Quizá es que no lo he entendido yo, pero si quiero poner 3 columnas ¿he de añadir un position:absolute para que no me baje las siguientes siempre?

Quiero hacer lo siguiente:

fila 1: COLUMNA 1 , 2, 3
fila 2: COLUMNA 1B , 2B, 3B
fila 3: COLUMNA 1C , 2C, 3C

De modo que B y C salgan en la altura en que se acaba la anterior... si es con absolute desde luego no puedo ya que si una se alarga chafa la otra...
  #5 (permalink)  
Antiguo 09/03/2007, 09:52
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: 3 columnas... y me baja una ¿por qué?

Hola, JBRS.
No sé si será algo así lo que estás queriendo hacer:

Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>JBRS</title>
  <meta http-equiv="Content-Type"
 content="text/html; charset=iso-8859-1">
  <style>
#bloquecontenido { margin: auto;
text-align: left;
width: 620px;
background-color: rgb(255, 204, 255);
}
#menuizquierda { left: 5px;
width: 75px;
float: left;
background-color: rgb(255, 102, 0);
}
#contenidoprincipal1 { color: black;
background-color: rgb(153, 153, 0);
}
#contenidoderecha1 { width: 145px;
float: right;
background-color: rgb(51, 102, 102);
}
  </style>
</head>
<body>
<div id="bloquecontenido">
<div id="contenidoderecha1"></div>
<div id="menuizquierda"></div>
<div id="contenidoprincipal1"></div>
</div>
</body>
</html>
Las he coloreado para que se vean.

En este hilo puse hace nada la explicación de por qué se baja esa caja a la siguiente línea y por qué debes cambiar el orden de las cajas para ordenarlas como quieres.

http://www.forosdelweb.com/f53/ancho-variable-1-3-columnas-470390/

Ya contarás.

Mikel.

Última edición por Mikmoro; 09/03/2007 a las 13:16
  #6 (permalink)  
Antiguo 11/03/2007, 07:55
Usuario no validado
 
Fecha de Ingreso: marzo-2004
Mensajes: 349
Antigüedad: 13 años, 8 meses
Puntos: 0
Re: 3 columnas... y me baja una ¿por qué?

Hola Mikel,

Lo pruebo mañana desde el trabajo, que con mi portátil no puedo. Pero sí me gustaría preguntarte un poco más las causas de que suceda eso, ya que las últimas pruebas que hice el viernes llegué a hacer algo que "casi" estaba correcto, pero en cuanto retocaba dimensiones de alguna columna (no necesariamente para aumentar) se iba a tomar viento. ¿Qué es lo que hace que se desordene? ¿cuando calcula que no cabe, cuando se pasa de ancho? (porque me da la sensación que si ocupan menos las columnas de su espacio definido, también se "alborota"). ¿Pueden entonces hacerse 4 columnas sin float o no es posible? ¿hay que fijar un ancho para cada columna y asegurarse que su margen impide que chafe la anterior?

Entiendo algo de que cuando no cabe lo manda abajo, pero sigo sin ver nada claro su fucionamiento posiblemente porque me lo planteo como si fueran celdas de una tabla y es muy diferente.
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 10:10.