如何在图像周围换行？

Question

I'm trying to wrap the text around the image but no success.

 <span>Zion Church</span>
    <div><a href="#"><img src="member.jpg"  width="" height="" class="floatleft"></a>
      jffhuhjherwkhrewkhurewyurewyretyunuyrkwugrnhky
      </div>

       img.floatleft {
       float: left;
       margin-left: 15px;
        }

Answer 1

The word "jffhuhjherwkhrewkhurewyurewyretyunuyrkwugrnhky" is too long to fit next to the image, so it moves down. If you want to force the word to break, try adding word-break: break-all to the CSS for the container element.

Answer 2

<style type="text/css">
a.imagelink {
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
}
</style>

<span>Zion Church</span>
<div><a href="#" class="imagelink"><img src="member.jpg"  width="" height="" class="floatleft"></a> jffhuhjherwkhrewkhurewyurewyretyunuyrkwugrnhky </div>