Foros del Web » Creando para Internet » CSS »

situado dos div a la derecha del div de contenidos

Estas en el tema de situado dos div a la derecha del div de contenidos en el foro de CSS en Foros del Web. Llevo de idea de colocar a la derecha de la página web junto al div maincontent ( que está posicionado a la izquierda) dos divs ...
  #1 (permalink)  
Antiguo 31/05/2009, 04:08
 
Fecha de Ingreso: septiembre-2008
Mensajes: 185
Antigüedad: 9 años, 2 meses
Puntos: 1
situado dos div a la derecha del div de contenidos

Llevo de idea de colocar a la derecha de la página web junto al div maincontent
( que está posicionado a la izquierda) dos divs uno debajo del otro con idea
de introducir en cada uno de ellos un panele de fichas de spry de dreamweaver.

Para pregunta es ¿ como hacerlo ? de momento lo he intentado de todas las
formas que conozco y no lo consiguo , haber si por favor me podeis echar
un cable
----------------------------------------------------------------------------------------
.twoColElsLtHdr #panel_1{
height:25%;
width:28%;
height:25%;
float: right;
margin-right: 25%;
clear: both;
position: relative;
}


.twoColElsLtHdr #panel_2{
height:25%;
width:28%;
height:25%;
float: right;
margin-right: 25%;
clear: both;
position: relative;
}


.twoColElsLtHdr #mainContent {
height:100%;
overflow:hidden;
display:block;
float: left;
width: 70%;
clear: both;

}

---------------------------------------------------------------------------------------
  #2 (permalink)  
Antiguo 31/05/2009, 09:55
Avatar de hades87  
Fecha de Ingreso: diciembre-2007
Ubicación: Barcelona - España
Mensajes: 3.194
Antigüedad: 10 años
Puntos: 68
Respuesta: situado dos div a la derecha del div de contenidos

mirate este link a ver si te puede ayudar.
__________________
No diseñes usando tablas.
  #3 (permalink)  
Antiguo 31/05/2009, 12:40
 
Fecha de Ingreso: septiembre-2008
Mensajes: 185
Antigüedad: 9 años, 2 meses
Puntos: 1
Respuesta: situado dos div a la derecha del div de contenidos

He seguido tus indicaciones y he creado esta estructura con su correspondiente
css. Pero de momento, se posicionando el panel_1 y panel_2 debajo de div
de contenido y no a la derecha y a la misma altura que el div de contenido
( un panel debajo del otro)
----------------------------------------
<div id="contenedor">

<div id="contenido ">

</div>

<div id="panel_1">

</div>

<div id="panel_2">

</div>

</div>
----------------------------------
css:

.twoColElsLtHdr #contenedor{
clear: both;
height:1%;
border: 1px solid #000000;
overflow:hidden;
width: 100%;
margin: 0 auto;
text-align: left; /* esto anula text-align: center en el elemento body. */
}

.twoColElsLtHdr #contenido {
overflow:hidden;
display:block;
float: left;
width: 70%;
clear: both;
}

.twoColElsLtHdr #panel_1{

margin-left: 10px; /* deben asignarse los márgenes izquierdo y derecho de cada elemento que vaya a colocarse en las columnas laterales */
margin-right: 10px;
width:25%;
float: right;
padding: 15px 0; /* el relleno superior e inferior crea un espacio visual dentro de este div */
}

.twoColElsLtHdr #panel_2{
margin-left: 10px;
margin-right: 10px;
width:25%;
float: right;
padding: 15px 0; /* el relleno superior e inferior crea un espacio visual dentro de este div */
}


----------------------------------------
  #4 (permalink)  
Antiguo 31/05/2009, 12:52
Avatar de hades87  
Fecha de Ingreso: diciembre-2007
Ubicación: Barcelona - España
Mensajes: 3.194
Antigüedad: 10 años
Puntos: 68
Respuesta: situado dos div a la derecha del div de contenidos

Podrías pasar la url de la web? a los div de la derecha y la izquierda les pones float?
__________________
No diseñes usando tablas.

Última edición por hades87; 01/06/2009 a las 14:41
  #5 (permalink)  
Antiguo 01/06/2009, 13:38
 
Fecha de Ingreso: septiembre-2008
Mensajes: 185
Antigüedad: 9 años, 2 meses
Puntos: 1
Respuesta: situado dos div a la derecha del div de contenidos

Los float como comprobarás estan colocados. Lo que no entiendo es si contenido
tiene un float left y los paneles tienen float right el panel 1 no se posicione a la
misma altura que el contenido y no debajo de contenido como me esta ocurriendo.
De hecho no he utilizado clear:both o clear:left. Mi idea es colocar contenido a la
izquierda y panel 1 a la derecha y debajo de panel 1 , panel 2. Pero no se que
es lo que falla.


.twoColElsLtHdr #contenedor {

overflow:hidden;
width: 100%;
margin: 0 auto;
text-align: left; }

twoColElsLtHdr #panel_1{
width: 30%;
float:right; }

twoColElsLtHdr #panel_1{
width: 30%;
float:right; }


.twoColElsLtHdr #contenido
width: 70%;
height:100%;
overflow:hidden;
float: left;
}
  #6 (permalink)  
Antiguo 01/06/2009, 13:53
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: situado dos div a la derecha del div de contenidos

pero si estás utilizando unas etiquetas en el html que no se corresponden con las clases del css.
Y por la forma de llamarlas en el css supongo que será de alguna plantilla que has bajado, así que debes haber hecho cambios incorrectos.

Recuerda, si modificas algo hecho y que funciona para adaptarlo, debes hacer un solo cambio y verificar su funcionamiento.

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #7 (permalink)  
Antiguo 01/06/2009, 16:27
 
Fecha de Ingreso: septiembre-2008
Mensajes: 185
Antigüedad: 9 años, 2 meses
Puntos: 1
Respuesta: situado dos div a la derecha del div de contenidos

Quiero agradecerte el consejo ¡ me ha sacado de atolladero !

Muchas Gracias
  #8 (permalink)  
Antiguo 01/06/2009, 16:29
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: situado dos div a la derecha del div de contenidos

nah, a todos nos ha pasado alguna vez. Cosas de novicios.
Me alegro.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
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.