[SOLUCIONADO] Posicionar imagenes

[Nerissa17]

Hola!

Estoy posicionando varias imagenes para una web y hay una que por mas que lo he intentado no he podido... Si veis la imagen,yo lo que quiero es poner las dos imagenes pequeñas al lado de la grande,pero solo puedo poner una




Gracias por pasar!

[pzin]

Pones dos elementos, por ejemplo div, que estén flotados:

Código CSS:

div {
  float: left;
}
 

Y ya tienes dos espacios, uno a cada lado, donde pones una y dos imágenes.

[Nerissa17]

Iniciado por pzin

Pones dos elementos, por ejemplo div, que estén flotados:

Código CSS:

div {
  float: left;
}
 

Y ya tienes dos espacios, uno a cada lado, donde pones una y dos imágenes.

gracias por tu respuesta,pero aun asi ahora tengo otro problema.... mira,ahora se me queda asi:



eso es poniendo el float en ambos elementos. Lo he probado en solo uno pero tengo otro problema parecido.

[pzin]

Publica aquí el código que estés usando. Seguramente no habrás entendido bien.

[Nerissa17]

Iniciado por pzin

Publica aquí el código que estés usando. Seguramente no habrás entendido bien.

mira,este es el de html:

Código HTML:

<div id="pictures2">
        <img class="type3" src="pictures/pic2.jpg"></img>
        <img class="float" src="pictures/pic3.jpg"></img>
        <img class="float" src="pictures/pic3.jpg"></img>
    </div>
 

y este es el del css:

Código CSS:

.float {
    float: right;
    width: 33%;
    height: 33%;
    margin-right: 0.4%;
}
.type1 {
    width: 33%;
    height: 33%;
}
.type3 {
    width: 66.2%;
    height: 80%;
}
 

el de las imagenes pequeñas (la de las ovejas) es el .type1 pero he creado el .float para hacer lo que me has dicho antes.
Y gracias por echarme una mano!!

[pzin]

La cuestión era meter las imágenes de la derecha en su propio contenedor. Algo así te valdría:

Código HTML:

<div id="pictures2">
  <img class="type3 columna" src="pictures/pic2.jpg">
  <div class="columna">
    <img src="pictures/pic3.jpg">
    <img src="pictures/pic3.jpg">
  </div>
</div>
 

Código CSS:

.columna {
  float: left;
}
 

Recuerda que las imágenes no tienen etiqueta de cierre. Si usas HTML5 lo pones tal cual como lo he puesto arriba, y si no debes de cerrar así: <img src="algo.jpg" />

Iniciado por Nerissa17

Y gracias por echarme una mano!!

Anytime!

[Nerissa17]

Iniciado por pzin

La cuestión era meter las imágenes de la derecha en su propio contenedor. Algo así te valdría:

Código HTML:

<div id="pictures2">
  <img class="type3 columna" src="pictures/pic2.jpg">
  <div class="columna">
    <img src="pictures/pic3.jpg">
    <img src="pictures/pic3.jpg">
  </div>
</div>
 

Código CSS:

.columna {
  float: left;
}
 

Recuerda que las imágenes no tienen etiqueta de cierre. Si usas HTML5 lo pones tal cual como lo he puesto arriba, y si no debes de cerrar así: <img src="algo.jpg" />



Anytime!

Salir me sale pero ahora tengo otro problema...
Las imagenes pueden tener cualquier tamaño,entonces quiero ponerle uno determinado pero cada vez que lo modifico o no me hace caso o las imagenes se me van a abajo. Se te ocurre alguna cosa??
Es que estoy probando varias cosas y no hay manera....

[pzin]

Si, cuando no caben a lo ancho se van hacia abajo, igual que haría un texto.

¿Qué necesitas hacer exactamente? ¿Eso varias veces para varias filas de imágenes con diferentes tamaños? O pon una imagen explicando el problema. Como es algo tan amplio, con mil problemas, luego cada problema puede tener veinte soluciones.

[Nerissa17]

Iniciado por pzin

Si, cuando no caben a lo ancho se van hacia abajo, igual que haría un texto.

¿Qué necesitas hacer exactamente? ¿Eso varias veces para varias filas de imágenes con diferentes tamaños? O pon una imagen explicando el problema. Como es algo tan amplio, con mil problemas, luego cada problema puede tener veinte soluciones.

Ya esta,ya lo he solucionado!!!

muchas gracias por la ayuda!!