Foros del Web » Creando para Internet » CSS »

Panel lateral fusiona los elementos

Estas en el tema de Panel lateral fusiona los elementos en el foro de CSS en Foros del Web. Hola tengo un problema, cuando se abre el panel lateral, los posts y la sidebar se fusionan, me parece que tiene que ver con position ...
  #1 (permalink)  
Antiguo 21/04/2011, 10:02
 
Fecha de Ingreso: mayo-2010
Mensajes: 118
Antigüedad: 7 años, 6 meses
Puntos: 1
Pregunta Panel lateral fusiona los elementos

Hola tengo un problema, cuando se abre el panel lateral, los posts y la sidebar se fusionan, me parece que tiene que ver con position absolute y relative.



http://idridplanet.blogspot.com/
  #2 (permalink)  
Antiguo 21/04/2011, 16:26
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Panel lateral fusiona los elementos

hola idrid, urgente pone todo dentro de un contenedor ;)

Código codigo:
Ver original
  1. <div id="contenedor">...contenido...</div>
  2. #contenedor{width:...; margin:0 auto;}

Saludos.
  #3 (permalink)  
Antiguo 24/04/2011, 10:21
 
Fecha de Ingreso: mayo-2010
Mensajes: 118
Antigüedad: 7 años, 6 meses
Puntos: 1
Respuesta: Panel lateral fusiona los elementos

Cita:
Iniciado por cristian_cena Ver Mensaje
hola idrid, urgente pone todo dentro de un contenedor ;)

Código codigo:
Ver original
  1. <div id="contenedor">...contenido...</div>
  2. #contenedor{width:...; margin:0 auto;}

Saludos.
Lo primero gracias xDD! , los el div de los posts tiene un margen a la izquierda y el de la sidebar a la derecha, como lo adapto?
  #4 (permalink)  
Antiguo 24/04/2011, 22:44
Avatar de cristian_cena
Colaborador
 
Fecha de Ingreso: junio-2009
Mensajes: 2.244
Antigüedad: 8 años, 5 meses
Puntos: 269
Respuesta: Panel lateral fusiona los elementos

a mi no me gusta que el diseño se flote hacia los costados, porque lo ves bien para la resolucion en que estas diseñando pero luego lo ves con otra resolución y te queres matar.

Pero si queres hacerlo así de todos modos podes darle float:left; al contenido de la izquierda y float:right; al contenido de la derecha. Para que funcione correctamente aplícale tambien al padre de las columnas flotadas overflow:hidden; (esto hará que el padre crezca en alto automáticamente según la altura de sus hijos flotados ;) )

Otra opción para hacer lo mismo pero sin usar float sería la siguiente:

das position:relative al padre contenedor (no te olvides de esto por favor, se buena persona).
y das position absolute a las cajas interiores

luego a las que quieres que tomen 'margen' izquierdo le das top:..; y left:...; (vale px, %, em, etc)
y a las que quieres que tomen distancia desde el borde derecho le das top:..; y right:...;

Por ultimo, yo no lo haría de ninguna de estas dos formas porque no me gusta, mas bien lo haría así:

<div id="contenedor">
<div class="columnas" id="columna_left">...contenido...</div>
<div class="columnas" id="columna_right">...contenido...</div>
</div>

#contenedor{width:...; overflow:hidden; margin:0 auto;}
.columnas{width:...; float:left;} /*aca flotamos las dos a la izquierda y damos el ancho justo para que entre justo en el ancho del contenedor*/
#columna_left{lo usas si quieres darle estilos especificos}
#columna_right{lo usas si quieres darle estilos especificos}

El ancho total de una caja css esta dado por la suma de margin+padding+width+border

Saludos
  #5 (permalink)  
Antiguo 25/04/2011, 04:59
 
Fecha de Ingreso: mayo-2010
Mensajes: 118
Antigüedad: 7 años, 6 meses
Puntos: 1
Respuesta: Panel lateral fusiona los elementos

Cita:
Iniciado por cristian_cena Ver Mensaje
a mi no me gusta que el diseño se flote hacia los costados, porque lo ves bien para la resolucion en que estas diseñando pero luego lo ves con otra resolución y te queres matar.

Pero si queres hacerlo así de todos modos podes darle float:left; al contenido de la izquierda y float:right; al contenido de la derecha. Para que funcione correctamente aplícale tambien al padre de las columnas flotadas overflow:hidden; (esto hará que el padre crezca en alto automáticamente según la altura de sus hijos flotados ;) )

Otra opción para hacer lo mismo pero sin usar float sería la siguiente:

das position:relative al padre contenedor (no te olvides de esto por favor, se buena persona).
y das position absolute a las cajas interiores

luego a las que quieres que tomen 'margen' izquierdo le das top:..; y left:...; (vale px, %, em, etc)
y a las que quieres que tomen distancia desde el borde derecho le das top:..; y right:...;

Por ultimo, yo no lo haría de ninguna de estas dos formas porque no me gusta, mas bien lo haría así:

<div id="contenedor">
<div class="columnas" id="columna_left">...contenido...</div>
<div class="columnas" id="columna_right">...contenido...</div>
</div>

#contenedor{width:...; overflow:hidden; margin:0 auto;}
.columnas{width:...; float:left;} /*aca flotamos las dos a la izquierda y damos el ancho justo para que entre justo en el ancho del contenedor*/
#columna_left{lo usas si quieres darle estilos especificos}
#columna_right{lo usas si quieres darle estilos especificos}

El ancho total de una caja css esta dado por la suma de margin+padding+width+border

Saludos
En ese caso hare tu forma, gracias ;)

Etiquetas: elementos, lateral, panel
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 08:06.