как отобразить изображение слева и справа пункта на той же строке

Question

я хочу сделать встроенный HTML стиль, я хочу, чтобы изображение поплавка влево, а пункт на правой бок о бок на одной и той же линии, но я не получают желаемого результата на код ниже:

Мой код ниже, или пожалуйста просмотреть jsFiddle

index.html

<div class="newWrapper"> 
    <div class="person1" style="float:left; display:inline-block; "> 
     <img src=simonwilliams.jpg width="auto" height"auto" clear:both;/> 
     <p style="float:right; display:block;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer arcu mauris, ullamcorper et ligula vitae, hendrerit sodales tellus. Maecenas quis pulvinar lacus.</p> 
    </div> 

    <div class="person2" style="float:left" display:inline-block;> 
     <img src=simonwilliams.jpg width="auto" height"auto"/> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer arcu mauris, ullamcorper et ligula vitae, hendrerit sodales tellus. Maecenas quis pulvinar lacus.</p> 
    </div> 
</div> 

Answer 1

Добавить пролет и сделать его float:left, а также добавить промежуток для <p> тега и сделать его float:right. В то же время, если вы хотите сделать это ниже div, вы можете сделать то же самое.

<div class="person1" style="float:left; display:inline-block; "> 
     <span style="float:left;width: 20%;"> 
      <img src="http://www.ninahale.com/wp-content/uploads/2013/08/Google.jpg" 
      width="70" height"70" /> 
     </span> 
     <span style="float:right;width: 80%;"> 
      <p style="float:right; display:block;">Lorem ipsum dolor sit amet,  
        consectetur adipiscing elit. Integer arcu mauris, ullamcorper et 
        ligula vitae, hendrerit sodales tellus. Maecenas quis pulvinar 
        lacus. 
      </p> 
     </span> 
</div> 

Demo

Answer 2

насчет стола и двух TDs?

<div> 
    <table> 
     <td><img src=simonwilliams.jpg width="auto" height"auto" clear:both;/> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer arcu mauris, ullamcorper et ligula vitae, hendrerit sodales tellus. Maecenas quis pulvinar lacus. 
     </td> 
     <td> 
<img src=simonwilliams.jpg width="auto" height"auto" clear:both;/> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer arcu mauris, ullamcorper et ligula vitae, hendrerit sodales 
    tellus. Maecenas quis pulvinar lacus. 
     </td> 
    </table> 
</div>