Duda sobre poner una imagen al lado de un texto

Lun Feb 12, 2018 8:52 pm

¡Hola!
Me ha pasado varias veces que he intentado poner un texto y una imagen dentro de un border y solo puedo ponerlos uno arriba del otro, nunca uno junto a otro. Ahora estoy haciendo un div dentro de un div (del maravilloso tutorial de Roshio) y agregue una imagen en el div interior y sigo sin poder ponerla al lado del texto Duda sobre poner una imagen al lado de un texto 3951139286

Duda sobre poner una imagen al lado de un texto 3951139286

No se sí hay algun codigo que no logró encontrar o si solo estoy haciendo algo mal.
Decidí preguntar por que la frustración pudo conmigo,... ¡Help!
Duda sobre poner una imagen al lado de un texto 2996817631

Duda sobre poner una imagen al lado de un texto 2996817631

Mar Feb 13, 2018 10:42 am

Hola @Narcisse, tranquila no te preocupes, yo te echo una mano! Duda sobre poner una imagen al lado de un texto 1f4aa

Para poner una imagen al lado de otro elemento (como texto), existen dos formas: La primera es usando una tabla, que es la más fácil y sin tantos problemas de alineación, y la segunda es usando divs.

Te dejo los tutoriales que tenemos acerca de tablas aquí:
★ Introducción al uso de tablas en HTML.
★ Empezar a usar tablas.

Y bueno la segunda opción, como te decía es poner usar divs de esta forma:

Código:: <div class="Imagencita"></div> <div class="Tutexto">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.</div>

Código:: .Imagencita { width: 150px; height: 150px; background-image: url(https://ic.pics.livejournal.com/menami_sama/32531158/590941/590941_original.png); border:5px solid #000; display:inline-block; } .Tutexto { width: 200px; height:150px; padding:10px; background-color: white; border: 1px solid #000; font-size: 9px; text-align:justify; font-family: calibri; display:inline-block; vertical-align: 19px; }

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

Espero que te sirviera y te dejo nuestro índice de tutoriales, seguramente te ayudará para ir avanzando y aprendiendo más.
★ Índice de Tutoriales.

Mar Feb 13, 2018 2:40 pm

¡Me has salvado la vida! Muchas gracias, @Roshio Duda sobre poner una imagen al lado de un texto 2531292851

Elementos

Dragon Ball

Pronto

Paraíso Personal

Amor y Amistad

Conejo de Pascua

Duda sobre poner una imagen al lado de un texto