Place text next to image

0

I'mtryingtoputapictureandtextontheside,butIcannot.ThetextisbelowthephotoorIcanputthefirstsentenceofthetextatthesamelevelasthetopoftheleftimage.

Itriedtousedisplay:block,tosomeextentitworks,becauseitstaysonthesideoftheimage,butitstaysasacolumn.

Itdoesnotlookthesameastheimageabove,withthetextunderthephoto.

<div><imgwidth="186" height="186" />
   Lorem Ipsum é simplesmente uma simulação de texto da indústria tipográfica e de impressos, e vem sendo utilizado desde o século XVI, quando um impressor desconhecido pegou uma bandeja de tipos e os embaralhou para fazer um livro de modelos de tipos. Lorem Ipsum sobreviveu não só a cinco séculos, como também ao salto para a editoração eletrônica, permanecendo essencialmente inalterado. Se popularizou na década de 60, quando a Letraset lançou decalques contendo passagens de Lorem Ipsum, e mais recentemente quando passou a ser integrado a softwares de editoração eletrônica como Aldus PageMaker.

</div>

My structure is the same as above. The image is 186px wide.

No CSS, only HTML I thought it worked.

Example:

link

    
asked by anonymous 09.10.2015 / 18:33

3 answers

7

See if this is what you want:

<table>
  <tr>
    <td><img  width="300" height="150" src='http://i.stack.imgur.com/dioLI.png'/></td>
    
    <td> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </br>
Phasellus bibendum aliquet erat, ut ornare purus malesuada et.</td> 
  </tr>
 
</table>
    
09.10.2015 / 18:42
7

You should put the image inside a <p> / <div> and use a align element in the <img> tag.

It would look like this:

<div>
   <img align="left">
   Lorem Ipsum
</div>
    
09.10.2015 / 18:45
6

I did it, I did it that way.

I put this property in the image and it worked.

img.face{
    float: left;
    border: transparent thin solid;
    padding: 5px;
    margin: 0px 10px 10px 0;
    max-width: 186px;
}
    
09.10.2015 / 18:57