CSS流对齐图像周围的文本

Question

在图像周围流动文字：

HTML

<div>
  <span id="photo"><img src="photo.png"</span>
  <span id="text">Lorem Ipsum, blah, blah, blah ...</span>
</div>

CSS

#photo {float:left;margin:0px 8px 5px 0px;}
#text {text-align:justify;}**

文本在图像周围流动，但没有对齐（保留对齐）。如果我向左浮动文本元素，那么对齐是正确的（正如我想要的那样），但是文本不会在图像周围流动，而是在图像下方流动 - 我该如何解决这个问题？

Answer 1

text-align属性实际上属于封闭块元素而不是内联元素。所以把它移到封闭区块：

div { text-align: justify; }

请参阅16.2 Alignment: the 'text-align' property的Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification：

  

此属性描述内联的方式   块的内容已对齐。值   具有以下含义：

（强调补充）

Answer 2

您需要将图像从范围中取出，或者向左浮动范围。