Cómo separar fotos de diferentes tamaños en secciones independientes en una web

migaso Seguir

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
13 Nov 2012
Mensajes
138
Hola, tengo varias fotos en una web agrupadas en dos tamaños. Hay unas cinco fotos de un tamaño menor (120x60px) y debajo las fotos de mayor tamaño (150x100px). Lo que pasa es que cuando quito una foto de menor tamaño se me sube una de mayor tamaño a la fila, y queda mal.

Quisiera saber que tengo que poner para dividir cada fila de fotos, para que las de menor tamaño no se mezclen con las de mayor, que sean independientes.

Ejemplo: a(foto menor) b(foto mayor)
aaaaa
bbbbb

Si borro una de la fila de a, queda así:
aaaab
bbbb

y yo quiero que quede así:
aaaa
bbbbb
 

Juan sur

Alfa
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Desde
15 Jun 2014
Mensajes
17
Lo que puedes hacer es definir una caja fila que llevara en su interior las fotos de la fila, y dentro de la fila una caja por foto de manera que le dices flotar a la izquierda a cada caja de foto. En css defines las propiedades de las cajas. Algo como esto.

<div class="Fila">
<div class="Foto">
<img src="imagenes/Coche1.jpg" border="0" height="1048" width="1547">
</div>
<div class="Foto">
<img src="imagenes/Coche2.jpg" border="0" height="1048" width="1547">
</div>
<div class="Foto">
<img src="imagenes/Coche3.jpg" border="0" height="1048" width="1547">
</div>
<div class="Foto">
<img src="imagenes/Coche4.jpg" border="0" height="1048" width="1547">
</div>
</div>

<div class="Fila">
<div class="Foto">
<img src="imagenes/casa1.jpg" border="0" height="1048" width="1547">
</div>
<div class="Foto">
<img src="imagenes/casa2.jpg" border="0" height="1048" width="1547">
</div>
<div class="Foto">
<img src="imagenes/casa3.jpg" border="0" height="1048" width="1547">
</div>
<div class="Foto">
<img src="imagenes/casa4.jpg" border="0" height="1048" width="1547">
</div>
</div>
 
Arriba