• Viernes 8 de Noviembre de 2024, 18:54

Autor Tema:  Posicion de un div debajo de otro de forma automatica  (Leído 2137 veces)

AndresFCECEP

  • Nuevo Miembro
  • *
  • Mensajes: 3
    • Ver Perfil
Posicion de un div debajo de otro de forma automatica
« en: Lunes 3 de Marzo de 2014, 22:02 »
0
Buenas tardes a todos quisiera saber si me pueden colaborar en como darle a los div un modo automatico para que aparezca de nuevo tal como los tengo debajo de los primeros ya que a traves de php cargo los datos y necesito que se me impriman n cantidad de veces gracias aqui dejo el codigo

Código: [Seleccionar]
@charset "UTF-8";

.foto{
list-style: none;

width: 6%;
height: 12%;

margin: 1.5% 3%;
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}

.ajustar{
list-style: none;

width: 6%;
height: 12%;


position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}

.circular {
width: 30px;
height: 30px;
border-radius: 15px;
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;
-webkit-border-radius: 15px; -moz-border-radius: 15px;
}

.info{
list-style: none;

width: 18%;
height: 30%;

margin: 1.5% 10.5%;
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;

}

.diasR{
list-style: none;

width: 6%;
height: 14%;

margin: 8.5% 3%;
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}

.mapa{
list-style: none;

width: 22%;
height: 23%;

margin: 5% 30%;
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}

.referido{
list-style: none;

width: 3%;
height: 5%;

margin: 1.5% 30%;
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}

.Adias{
list-style: none;

width: 3%;
height: 5%;

position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}
.recordatorio{
list-style: none;

width: 3%;
height: 5%;

margin: 1.5% 37%;
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}

.Arecordatorio{
list-style: none;

width: 3%;
height: 5%;

position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}
.comentarios{
list-style: none;
overflow-y: scroll;
width: 49%;
height: 20%;

margin: 17% 3%;
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;

}
#comentariado{


width: 46%;
height: 8%;
margin: 0.5% 1%;
background-color: rgb(55,22,11);
border:3px solid #f4f4f4;
background:rgba(255,255,255,.5);
position: fixed;

-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: 0 0 2px #aaa;
-moz-box-shadow: 0 0 2px #aaa;
box-shadow: 0 0 2px #aaa;
}

.cajaComunicacion{
  width:13%;
  height: 21%;


  margin:1% 55%;
  padding:10px 50px;
  border:3px solid #f4f4f4;
  background:rgba(255,255,255,.5);
  position: fixed;

  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
 
  -webkit-box-shadow: 0 0 2px #aaa;


  -moz-box-shadow: 0 0 2px #aaa;
  box-shadow: 0 0 2px #aaa;
}

.cajaR{
  width:13%;
  height: 21%;


  margin:14% 55%;
  padding:10px 50px;
  border:3px solid #f4f4f4;
  background:rgba(255,255,255,.5);
  position: fixed;

  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
 
  -webkit-box-shadow: 0 0 2px #aaa;


  -moz-box-shadow: 0 0 2px #aaa;
  box-shadow: 0 0 2px #aaa;
}


Haggen

  • Miembro activo
  • **
  • Mensajes: 88
  • Nacionalidad: mx
    • Ver Perfil
    • Mis proyectos
Re:Posicion de un div debajo de otro de forma automatica
« Respuesta #1 en: Miércoles 28 de Mayo de 2014, 19:27 »
0
 no me queda muy claro que quieres hacer, pero puedes usar posiciones absolutas para posicionar tus dos capas, o usar tablas y así tener una capa y otra abajo de la primera.