Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Centrar un div dentro de otro

Estas en el tema de Centrar un div dentro de otro en el foro de CSS en Foros del Web. Buenas. Tengo un div general, y dentro de él, voy creando un div por cada imagen que encuentro en un directorio. De los div's que ...
  #1 (permalink)  
Antiguo 13/07/2014, 12:13
 
Fecha de Ingreso: enero-2002
Ubicación: Sabadell
Mensajes: 565
Antigüedad: 22 años, 10 meses
Puntos: 4
Centrar un div dentro de otro

Buenas.
Tengo un div general, y dentro de él, voy creando un div por cada imagen que encuentro en un directorio.
De los div's que voy creando tengo asignado un ancho máximo, de manera que según el ancho del navegador, cabrán 2, 3, 4 por línea.
Mi pregunta: como hacer que estos div's, los 2, 3 o 4 por línea queden centrados? Ahora me quedan a la izquierda.

Código PHP:
Ver original
  1. <div id=div1>
  2. <?php
  3.     $directorio = opendir('./img/thumbs');
  4.     while ($img = readdir($directorio)) {
  5.         if ($img != "." && $img != "..") { ?>
  6.             <div class="class1">
  7.                 <img src="<?php echo URL."$img; ?>"/>
  8.             </div>
  9. <?php       }
  10.     }
  11.     closedir($directori);
  12. ?>
  13. </div>

Código CSS:
Ver original
  1. #div1 {
  2.     width:100%;
  3.     float:left;
  4. }
  5. .class1 {
  6.     float:left;
  7.     max-width:235px;
  8.     height:160px;
  9.     border:1px solid #D9D9DB;
  10.     background:#D4D4D4;
  11.     margin:1%;
  12. }
  13. .class1 img {
  14.     margin-right:1%;
  15.     height:100%;
  16.     width:100%;
  17.     padding:2%;
  18. }

Gracias
__________________
Qué fácil cuando lo sabes y qué difícil cuando no
  #2 (permalink)  
Antiguo 14/07/2014, 01:25
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Centrar un div dentro de otro

Lo más fácil sería usar inline-block en lugar de flotarlos y usar un alineado de texto en el padre para centrar el contenido.

Se podría incluso centrar elementos flotados, pero ya requiere de algo más de código y alguna pirulilla.
  #3 (permalink)  
Antiguo 14/07/2014, 01:34
 
Fecha de Ingreso: enero-2002
Ubicación: Sabadell
Mensajes: 565
Antigüedad: 22 años, 10 meses
Puntos: 4
Respuesta: Centrar un div dentro de otro

Gracias pzin por tu respuesta.
He hecho lo que has dicho:
- añadir text-align:center al padre, és decir, en el div1
- sustituir float:left por display:inline-block a las subcapas, class1.
Y perfecto.
__________________
Qué fácil cuando lo sabes y qué difícil cuando no

Última edición por mblascog; 14/07/2014 a las 01:42

Etiquetas: php
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 03:19.