Foros del Web » Creando para Internet » CSS »

Duda sencilla.

Estas en el tema de Duda sencilla. en el foro de CSS en Foros del Web. Tengo tres divs y quieron que se pongan uno detras de otro y ademas se alinena a la derecha....
  #1 (permalink)  
Antiguo 22/12/2010, 17:24
 
Fecha de Ingreso: noviembre-2009
Mensajes: 846
Antigüedad: 8 años, 1 mes
Puntos: 34
Duda sencilla.

Tengo tres divs y quieron que se pongan uno detras de otro y ademas se alinena a la derecha.
  #2 (permalink)  
Antiguo 22/12/2010, 22:45
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Duda sencilla.

Cita:
Iniciado por mariomon17 Ver Mensaje
Tengo tres divs y quieron que se pongan uno detras de otro y ademas se alinena a la derecha.
bueno podrias fltarlos a la derecha, etc etc.. acomodarlos todos de un lado con las reglas correspondientes.. y jugar con el z-index.. tambien deberian estar en posicion absoluta

la posicion absoluta va a ser que se pisen, y con el z-index decidis cual aparesca primero segundo y tercero.. o sea la posicion en capas podriamos decir

te doy un ejemplo:

Código PHP:
<html>
<
body>
<
style>
#uno{float:left;
    
width:200px;
    
height:200px;
    
background-color:red;
    
z-index:3;
position:absolute;
}

#dos{float:left;
    
width:200px;
    
height:200px;
    
background-color:green;
    
z-index:1;
position:absolute;
}
#tres{float:left;
    
width:200px;
    
height:200px;
    
background-color:pink;
    
z-index:2;
position:absolute;
}
</
style>


<
div id="uno"></div>
<
div id="dos"></div>
<
div id="tres"></div>
</
body>
</
html
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>

Última edición por GAST0N; 22/12/2010 a las 22:57
  #3 (permalink)  
Antiguo 23/12/2010, 07:34
 
Fecha de Ingreso: noviembre-2009
Mensajes: 846
Antigüedad: 8 años, 1 mes
Puntos: 34
Respuesta: Duda sencilla.

Muchas gracias, pero me exprese mal.
Lo que quiero es que aparezcan uno detras de otro en la misma linea, no uno encima de otro, alineados en horizontal y colocados a la derecha.

Codigo actual:
Código CSS:
Ver original
  1. .paginator {
  2.     height: 40px;
  3.     width: 500px;
  4. }
  5.  
  6. .num {
  7.     float: left;
  8.     margin-top: 10px;
  9.     float: left
  10. }
  11.  
  12. .button {
  13.     background: #CCC;
  14.     border: 1px solid #000;
  15.     text-align: center;
  16.     width: 25px;
  17.     height: 20px;
  18.     padding: 3px;
  19.     margin: 5px;
  20.     display: block;
  21.     float: left
  22. }

Codigo HTML:
Código HTML:
Ver original
  1. <div class="paginator">
  2. <div class="button"></div>
  3. <div class="button"></div>
  4. <div class="num"></div>
  5. <div class="button"></div>
  6. <div class="button"></div>
  7. </div>
  #4 (permalink)  
Antiguo 23/12/2010, 07:37
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Duda sencilla.

en ese caso entonces usa el mismo codigo que te deje, quitale la posicion absoluta y el z index..

querdaria asi

Código PHP:
<html>
<
body>
<
style>
#uno{float:right;
    
width:200px;
    
height:200px;
    
background-color:red;
    
}

#dos{float:right;
    
width:200px;
    
height:200px;
    
background-color:green;
    
}
#tres{float:right;
    
width:200px;
    
height:200px;
    
background-color:pink;
    
}
</
style>


<
div id="uno"></div>
<
div id="dos"></div>
<
div id="tres"></div>
</
body>
</
html
[/QUOTE]
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #5 (permalink)  
Antiguo 23/12/2010, 08:48
 
Fecha de Ingreso: noviembre-2009
Mensajes: 846
Antigüedad: 8 años, 1 mes
Puntos: 34
Respuesta: Duda sencilla.

Si, pero me surge el problema siguiente: se me salta al siguiente div y este se va acia la izquierda. Y el orden de los divs tambien varia.


Lo que quiero es que pase lo de la segunda imagen pero se ponga a la derecha!
Gracias

Última edición por mariomon17; 23/12/2010 a las 08:58
  #6 (permalink)  
Antiguo 23/12/2010, 09:20
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Duda sencilla.

Cita:
Iniciado por mariomon17 Ver Mensaje
Si, pero me surge el problema siguiente: se me salta al siguiente div y este se va acia la izquierda. Y el orden de los divs tambien varia.


Lo que quiero es que pase lo de la segunda imagen pero se ponga a la derecha!
Gracias

podrias hacer un dibujo aunque sea en paint, para ver como queres que te queden posicionados los div.. porque no logro entender
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #7 (permalink)  
Antiguo 23/12/2010, 09:42
 
Fecha de Ingreso: noviembre-2009
Mensajes: 846
Antigüedad: 8 años, 1 mes
Puntos: 34
Respuesta: Duda sencilla.



Esta imagen es mas completa.
Te cuento, el paginador esta compuesto por cuatro botones y en el medio un indicador del numero de pagina. Para estar unos detras de otros tienen la propiedad Float: left (Imagen 1)

Yo quiero que todo eso se ponga en el lado derecho, si pongo a .button y a .num la propiedad float: right. Se me cambia de posicion los botones (Imagen 2)

Yo quiero que eude como (Imagen 3)
  #8 (permalink)  
Antiguo 23/12/2010, 09:46
 
Fecha de Ingreso: noviembre-2009
Mensajes: 846
Antigüedad: 8 años, 1 mes
Puntos: 34
Respuesta: Duda sencilla.

Ah, por cierto!
Todo eso esta dentro de un div class paginator, pues si a este le pongo la propiedad float: right.
Queda como quiero que quede pero se sube lo de abajo.
Mira,
  #9 (permalink)  
Antiguo 23/12/2010, 10:43
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Duda sencilla.

primero entonces, trata de ubicar el paginator.. que quede donde vos queres, dale un background-color.. para saber bien su ubicacion, luego se lo sacas.... despues los botones los vas ubicando tomanado como referencia su contenedor,.. o sea a #paginator
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #10 (permalink)  
Antiguo 23/12/2010, 10:44
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Duda sencilla.

podrias mostrar el html completo de esa pagina para saber bien la ubicacion del rsto de los div
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #11 (permalink)  
Antiguo 23/12/2010, 11:24
 
Fecha de Ingreso: noviembre-2009
Mensajes: 846
Antigüedad: 8 años, 1 mes
Puntos: 34
Respuesta: Duda sencilla.

Voy a probar cambiando el orden de los botones en el caso de la imagen 2.
Ya os contare!
  #12 (permalink)  
Antiguo 23/12/2010, 12:57
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Duda sencilla.

Hola:

Cita:
Iniciado por mariomon17 Ver Mensaje
Queda como quiero que quede pero se sube lo de abajo.
Pues dale un poco más de width, al no caber en la misma "linea" se moverá hacia abajo quedando como quieres que quede.

Saludos.

  #13 (permalink)  
Antiguo 23/12/2010, 15:27
 
Fecha de Ingreso: noviembre-2009
Mensajes: 846
Antigüedad: 8 años, 1 mes
Puntos: 34
Respuesta: Duda sencilla.

Ya lo he probado pero no me funciona, se hace alto pero no amplia los div en los que esta dentro, esto es lo que intento ahora mismo pero no lo consigo...
  #14 (permalink)  
Antiguo 23/12/2010, 15:48
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Duda sencilla.

Cita:
Iniciado por mariomon17 Ver Mensaje
Ya lo he probado pero no me funciona, se hace alto pero no amplia los div en los que esta dentro, esto es lo que intento ahora mismo pero no lo consigo...
enviame tu msn por privado o tu facebook, y vemos tu problema.. seguro asi lo solucionamos =)
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #15 (permalink)  
Antiguo 23/12/2010, 16:01
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 8 años, 5 meses
Puntos: 137
Respuesta: Duda sencilla.

Cita:
Iniciado por GAST0N Ver Mensaje
enviame tu msn por privado o tu facebook, y vemos tu problema.. seguro asi lo solucionamos =)
Si quieres ayudar, hazlo desde este mismo foro que para eso esta
  #16 (permalink)  
Antiguo 23/12/2010, 16:06
 
Fecha de Ingreso: noviembre-2009
Mensajes: 846
Antigüedad: 8 años, 1 mes
Puntos: 34
Respuesta: Duda sencilla.

Cita:
Iniciado por GAST0N Ver Mensaje
enviame tu msn por privado o tu facebook, y vemos tu problema.. seguro asi lo solucionamos =)
Muchas gracias por tu buena intencion, pero ya lo solucione.

Lo que hice es .num y .button con
float: right

le quite el widht a .paginator

Y como el resultado de esto es la imagen 2, que quedaba invertido pues inverti en el codigo el orden de los botones y ya me salo todo perfecto.

Muchas gracias a todos!
  #17 (permalink)  
Antiguo 23/12/2010, 16:18
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 7 años, 4 meses
Puntos: 64
Respuesta: Duda sencilla.

Cita:
Iniciado por mariomon17 Ver Mensaje
muchas gracias por tu buena intencion, pero ya lo solucione.

Lo que hice es .num y .button con
float: Right

le quite el widht a .paginator

y como el resultado de esto es la imagen 2, que quedaba invertido pues inverti en el codigo el orden de los botones y ya me salo todo perfecto.

Muchas gracias a todos!
q bueno q lo solucionaste..... Por cualquier otro problema, no dudes en consultar =) saludos
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>

Etiquetas: sencilla
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 02:50.