如何在图像周围包装特定文本？

Question

我试图围绕图像包装文本但没有成功。

 <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

单词“jffhuhjherwkhrewkhurewyurewyretyunuyrkwugrnhky”太长而无法放在图像旁边，所以它会向下移动。如果要强制单词中断，请尝试将word-break: break-all添加到容器元素的CSS中。

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>