帶圖像浮動選項的文本溢出

嗯，我試圖把圖片放在左邊，用浮動選項，並且沒有文字應該出現在第一個圖像下面，直到下邊框。我怎樣才能做到這一點？（我使文本太長，因爲我需要考慮不同的電腦屏幕的分辨率不同，可能包裹）帶圖像浮動選項的文本溢出

而另外一個問題，第二個圖像，我想它的left side與第一個的right side對齊，那可能嗎？

HTML是在這裏：

<html> 
    <head> 
     <title> This is an demo </title> 
     <style> 
      .left { 
       float: left; 
      } 
      .content { 
       clear: both; 
       border-color: #666666; 
       border-bottom: 3px solid; 
      } 
     </style> 
    </head> 
    <body> 
     <div class="content"> 
      <img class="left" src="61add42atw1dnf1k4h4qzj.jpg" /> 
      <p> ThiThis is a not so long parThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphagraphs is a not so long parThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphThis is a not so long paragraphagraph</p> 
      <img src="61ab8006jw1dnfas8bvj9j.jpg" /> 
     </div> 
    </body> 
</html>

enter image description here