Página 1 de 1

Imagen alineada con el texto

Publicado: 20 Ago 2010, 11:28
por FasterBit
URL: http://www.thefasterbit.com/viewtopic.p ... t=8&p=9#p9
Versión phpBB: phpBB3 (Ultima)
MODs Instalados: Ninguno
Plantilla(s) usada(s): X-Treme Skin
Servidor: De pago con Iberonet
Actualización desde otra versión: No
Conversión desde otro sistema de foros: No

Hola, me gustaría saber como puedo hacer que el texto quede alineado con la imagen, como si hubiera una tabla. Si pongo imagen y texto en la misma linea solo se alinea con una de ellas, pero el resto del texto sale debajo o encima, quiero que todo el párrafo quede en el lateral de la imagen.

Para que lo entendáis mejor, quiero que la información que sigue a la portada salga a la derecha junto a la imagen, no debajo. Espero que me hayáis entendido y disculpad si soy pesado pero es que hay gente que ni así lo llega a entender.

http://www.thefasterbit.com/viewtopic.p ... t=8&p=9#p9

Re: Imagen alineada con el texto

Publicado: 20 Ago 2010, 12:52
por Persephone
Eso se consigue con una propiedad que se llama float.
Por ejemplo si pones float: left; saldria la imagen a la izquierda y el texto a la derecha al lado.

Ahora si lo quieres esa propiedad en un BBCode no se como conseguirlo Imagen tampoco se decirte si existe ya un BBCode asi.

Re: Imagen alineada con el texto

Publicado: 20 Ago 2010, 19:18
por leviatan21
Hola FasterBit :
Tal como dice Persephone, lo que buscas es una propiedad llamada float.

Yo alguna vez probé creando un bbcode así :
Uso de BBCode

Código: Seleccionar todo

[float={SIMPLETEXT}]{TEXT}[/float] 
Reemplazo HTML

Código: Seleccionar todo

<span style="float: {SIMPLETEXT}; margin: 0px 5px 5px 5px;">{TEXT}</span> 
Línea de ayuda

Código: Seleccionar todo

[float=(left|right)]....[/float] 
Lo puedes utilizar con texto, imágenes o adjuntos ( si creas miniaturas mejor ), Ejemplo :

Ejemplo con imágenes :

Código: Seleccionar todo

[float=left][img]http://www.google.com.ar/intl/en_com/images/srpr/logo1w.png[/img][/float]( texto largo aquí)  
Ejemplo con Adjuntos

Código: Seleccionar todo

[float=right][attachment=0]Linea de tiempo.jpg[/attachment][/float]( texto largo aquí)