Centrar varias div con img+texto Hola Amigos, llevo unos días dandole a este tema y no acabo de conseguir lo que quiero. En el cuerpo central de la web quiero tener la imagen con su texto correspondiente debajo y centrado. He puesto una anchura máx de 900 por lo que en el pc consigo las filas con 3 img cada una pero cuando me voy al movil me deja una foto con su texto, que es lo que pretendo, pero no lo centra, lo larga contra el margen izg por el float:left; . Cómo puedo conseguir que cuando por tamaño de la pantalla no quepan 3 img por fila y solo 2 por ejemplo, que aparezcan las 2 pero centradas. Podéis ver lo que trato de hacer en www.bemequer.com/index3.htm . No necesitáis verlo en el movil con simplemente reducir lateralmente la pantalla del pc vereis como van saltando pero todo alineado a la izquierda.
Gracias de antemano! ;)
Os dejo aqui el código que uso:
HTML
<div style="margin: 0 auto; max-width: 900px;">
<div class="img">
<a href="programas-ejercicio-para-mujeres/programa-de-ejercicio-para-mujeres.htm">
<img style="box-shadow: 0px 0px 4px #CCCCCC;" src="fotos/programa-mujeres1.jpg" alt="Programas de ejecicio para mujeres" title="Programas de ejecicio para mujeres" width="100%"></a>
<div class="imgtext">En Bemequer somos
especialistas en <a href="programas-ejercicio-para-mujeres/programa-de-ejercicio-para-mujeres.htm">entrenamientos
personales para mujeres</a>. El novedoso sistema PT4 consiste en un entrenamiento
personal con un máximo de 4 alumnas. Para objetivos diferentes programas
diferentes.</div>
</div>
<div class="img"> <a href="programa-adelgazamiento/programa-adelgazamiento.htm"><img style="box-shadow: 0px 0px 4px #CCCCCC;" src="fotos/adelgazamiento.jpg" alt="Programa de adelgazamiento y sobrepeso" title="Programa de adelgazamiento y sobrepeso" width="100%"></a>
<div class="imgtext">Harás
ejercicio acompañada por un entrenador personal con el novedoso sistema
PT4. La Electroestimulación Neuromuscular combinada con ejercicio aeróbico
te permite <a href="programa-adelgazamiento/programa-adelgazamiento.htm">
adelgazar </a> reduciendo la grasa localizada donde más te preocupa. </div>
</div>
<div class="img"> <a href="entrenamiento-personal-sistema-pt4/entrenamiento-personal-sistema-pt4.htm"><img style="box-shadow: 0px 0px 4px #CCCCCC;" src="fotos/pmf.jpg" alt="Programa de mejoramiento físico" title="Programa de mejoramiento físico" width="100%"></a>
<div class="imgtext">Es un entrenamiento
completo que combina fuerza, ejercicio aeróbico y flexibilidad con ejercicios
específicos para cada cliente. Ejercicio adaptado a ti, progresiones para
conseguir tus objetivos, acompañamiento de un <a href="entrenamiento-personal-sistema-pt4/entrenamiento-personal-sistema-pt4.htm">entrenador
personal</a>. </div>
</div>
</div>
<div style="margin: 0 auto; max-width: 900px; width: 100%;">
<div class="img"> <a href="programa-de-modelacion/programa-de-modelacion.htm"><img style="box-shadow: 0px 0px 4px #CCCCCC;" src="fotos/modelacion.jpg" alt="Programa de entrenamiento modelación con objetivos estéticos" title="Programa de entrenamiento modelación con objetivos estéticos" width="100%"></a>
<div class="imgtext">Silueta Sana
<a href="programa-de-modelacion/programa-de-modelacion.htm">Modelación</a>
combina ejercicio aeróbico y tonificación muscular y electroestimulación
neuromuscular. Sobre abdomen para eliminar el inestético flotador y sobre
zona de glúteos y muslos para eliminar las cartucheras. </div>
</div>
<div class="img"> <a href="pilates/pilates-en-grupos-reducidos.htm"><img style="box-shadow: 0px 0px 4px #CCCCCC;" src="fotos/pilates.jpg" border="0" alt="Clases de Pilates en grupos reducidos" title="Clases de Pilates en grupos reducidos" width="100%"></a>
<div class="imgtext">La actividad
de <a href="pilates/pilates-en-grupos-reducidos.htm">Pilates</a> puede
ser complementada con otras clases como un Programa de Mejoramiento Físico
(cardio) o Gimnasia Abdominal Hipopresiva. Grupos de 4 o 6 personas y adaptado
a las posibilidades físicas de cada uno. </div>
</div>
<div class="img"> <a href="ejercicio-adaptado-a-patologias/ejercicio-adaptado-a-patologias.htm"><img style="box-shadow: 0px 0px 4px #CCCCCC;" src="fotos/patologias.jpg" border="0" alt="Ejercicio adaptado a patologías" title="Ejercicio adaptado a patologías" width="100%"></a>
<div class="imgtext">Somos un equipo
de técnicos del deporte y de la fisioterapia comprometidos con el ejercicio
controlado y con la <a href="ejercicio-adaptado-a-patologias/ejercicio-adaptado-a-patologias.htm">actividad
física para la salud</a>. Somos especialistas en entrenamiento adaptado
a patologías: artrosis, osteoporosis, fibromialgia, ... </div>
</div>
</div>
--CSS--
.img {
float: left;
margin:auto;
padding: 4px;
text-align: justify;
font-family: Verdana, Geneva, sans-serif;
font-size: 14px;
line-height: 200%;
max-width:290px;
}
.imgtext{
margin-top: 5px;
height: 250px;
max-width: 280px;
}
