Acomodar texto alrededor de imágen

Jona77 · #1 (**permalink**) 08/05/2006, 05:08

Hola Gente

¿Cómo se podría hacer para que al listar información de una base de datos, el texto se acomode alrededor de una imagen? Algo así como si fuera la función de alineación "cuadrado" de Word.

Gracias.

Jona77 · #2 (**permalink**) 08/05/2006, 05:38

Se me ocurre que puedor leer el alto de la imágen en píxeles, despues cerrar la fila de la tabla y seguir escribiendo en una fila nueva. Pero, ¿cómo leo el alto de la imagen?

Gracias.

bhagat · #3 (**permalink**) 08/05/2006, 14:09

Si al insertar una imagen le incluyes

Cita:

style="float:right"

o

Cita:

style="float:left"

ell texto fluirá a la izquierda o a la derecha de la imágen.

thisisalexis · #4 (**permalink**) 08/05/2006, 21:19

.imagen{ float:right;} ---> el texto se colocará a la izquierda de la imagen.

.imagen{ float:left;} ---> el texto se colocará a la derecha de la imagen.

preguntoncio · #5 (**permalink**) 10/05/2006, 12:37

Que tal,
Justo ayer buscaba como hacer esto, y bueno practicamente ya esta hecho.. pero una sola pregunta amigos: Yo estoy usando este codigo:

Cita:

<img src="mifoto.jpg" style="float:left;"

como ya saben la imagen se acomoda al lado izquiedo.. pero el texto que esta al lado de la imagen esta muy pegado.. como hago para que se separe de la imagen??? (como en las tablas usando un padding)..

Ojala puedan darme una mano..

JavierB · #6 (**permalink**) 10/05/2006, 12:43

Hola preguntoncio

Ponle margenes con los valores que prefieras:

Código:

<img src="mifoto.jpg" style="float:left; margin-right:10px; margin-bottom:10px" />

Saludos,

preguntoncio · #7 (**permalink**) 10/05/2006, 14:07

Lo menos que puedo hacer es agradecerte mucho por el dato JavierB.. Muchas gracias deberas, jeje eso me va a evitar miles de aspirinas :D (tu sabes, todo cuesta)

bhagat · #8 (**permalink**) 11/05/2006, 04:02

Preguntoncio

El codigo que escribió Javier B es correcto, solo que hay una forma mas abreviada de escribirlo; por ejemplo:
en lugar de escribir

Cita:

margin-top:5px; margin-right:10px; margin-bottom:15px; margin-left:20px;

lo cual es correcto, en su lugar puedes escribir lo siguiente:

Cita:

margin:5px 10px 15px 20px;

automaticamente le asigna los valores a top, right, bottom, left, por ese orden (agujas del reloj)

incluso si coinciden las medidas Top igual a bottom y left igual medida que right solo es necesario escribir 2 valores, así por ejemplo:

Cita:

margin:5px 10px;

estaría asignando un margen de 5 pixel a top y a bottom y 10 pixel a left y right

un saludo

preguntoncio · #9 (**permalink**) 11/05/2006, 13:22

okas bhagat, eso tambien ayuda mucho.... como que me puedo evitar algunos errores por escribir demasiados "margin" (por ahi quizas lo escribo mal)..

Muchas gracias por su ayuda a ambos!