HTML - otra duda con el posicionamiento flotante

   
Vista:

otra duda con el posicionamiento flotante

Publicado por Gustavo (87 intervenciones) el 04/04/2014 18:02:46
Hola gente se me presento otra duda con el posicionamiento flotante.
Puse 3 imagenes una abajo de otra usando un div para cada una y posicione de forma flotante la primer imagen a la izquierda , segun lo que lei el comportamiento tedria q ser : La imagen1 es de tipo flotante, por lo que desaparece del flujo normal de la página y el resto de las imagenes ocupan su lugar. El resultado es que la imagen 2 ahora se muestra donde estaba la imagen 1 y la imagen 3 se muestra donde estaba la imagen 2.
Al mismo tiempo, la imagen 1 se desplaza todo lo posible hacia la izquierda de la posición en la que
se encontraba. El resultado es que la imagen 1 se muestra encima de la nueva posición de la imagen 2 y
tapa todos sus contenidos.
O sea la imagen 1 tendria q tapar la imagen 2 q subio donde estaba la imagen 1 y la imagen 3 se mostraria donde estaba la imagen 2.
El problema es que hice el ejercicio y no pasa esto si no que la imagen 2 se muestra a la derecha de la imagen 1 y la imagen 3 se muestra abajo de la imagen 1.

les paso el código html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<body>
 
<div class="izquierda">
 
<img src="http://i1177.photobucket.com/albums/x348/TANGO2013/9a.jpg">
 
</div>
 
 <div>
 
 <img src="http://i1177.photobucket.com/albums/x348/TANGO2013/sirena.png">
 
 </div>
 
 <div>
 
 <img src="http://i1177.photobucket.com/albums/x348/TANGO2013/genesis.jpg">
 
 </div>
 
 
 
</body>
</html>


y el código css.

1
.izquierda {float:left;}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

otra duda con el posicionamiento flotante

Publicado por xve (1178 intervenciones) el 05/04/2014 11:35:01
Hola Gustavo no entiendo muy bien donde tienes el problema.

Los objetos flotantes, están todas flotando, nunca una encima de la otra, si no cabe en su posición por anchura, crece hacia abajo.

Si nos puedes comentar...
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

otra duda con el posicionamiento flotante

Publicado por Gustavo (87 intervenciones) el 05/04/2014 18:02:43
Hola xve para que te des una idea te paso un link q esta lo que te digo es la figura 5.14 y el texto q esta debajo de esta.
Lo que pregunto es porque no se cumple ese comportamiento que dice ahi.


Te dejo el link.



http://librosweb.es/css/capitulo_5/posicionamiento_flotante.html
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve

otra duda con el posicionamiento flotante

Publicado por xve (1178 intervenciones) el 05/04/2014 22:33:19
Hola Gustavo, el texto que esta debajo, no es float:left... únicamente lo son las cajas... el texto, seguramente es un text-align:center...

También podría ser un float:left, con un margin o padding izquierdo... pero no lo creo.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

otra duda con el posicionamiento flotante

Publicado por Gustavo (87 intervenciones) el 06/04/2014 00:12:03
ah fijate q en el texto dice: Al mismo tiempo, la caja 1 se desplaza todo lo posible hacia la izquierda de la posición en la que se encontraba, asi que creo q es un float:left.

Pero concretamente eso q muestra la imagen que la caja 1 tapa la caja 2 y queda la caja 1 con la 3 cuando pasa ?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve

otra duda con el posicionamiento flotante

Publicado por xve (1178 intervenciones) el 06/04/2014 20:46:10
Pero Gustavo, ese ejemplo al que haces referencia es el 5.13 o el 5.14??? tu me has dicho que es la figura 5.14!!!

He leído el texto, pero no entiendo muy bien donde esta la caja2, ya que para que quede debajo, tiene que estar con posición absoluta... no lo se entender muy bien... pero lo que es seguro, es que únicamente con float, no consigues poner una capa encima de la otra.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

otra duda con el posicionamiento flotante

Publicado por gustavo (87 intervenciones) el 06/04/2014 23:50:53
ah ok gracias xve eso es lo que queria saber , el texto era el que estaba debajo de la 5.14 y esa era la figura a la que hacia referencia , pero ya me lo aclaraste muchas gracias de nuevo xve
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar