在div裏面，我有一張圖片，然後是段落，然後是圖片。我無法將第二張圖像放在段內'

Question

因此，我有一個div，裏面有3個東西; 1.一張圖片（一個大左引號） 2.一個活文本段落 3.另一張圖片在最後（大右引號）。

第一張圖像放在div中時會使文字環繞，這很棒。它似乎是該段的一部分。

我的問題：我不能讓第二個圖像在最後的段落裏面。它被推到段落區域下面。我希望它能夠用我的段落文本'換行'。

#textarea { 
width: 185px; 
height: 70px; 
padding: 49px; 

}

#textarea p { 
font-size: 15px; 
font-weight: bold; 
color: #4D6F79; 
line-height: 230%; 
text-align: center; 
-webkit-margin-after: 0em; 
-webkit-margin-before: 0em; 

}

<div id= "textarea"> 
      <img src="images/leftquote.png" width="36" height="43" alt="left quotation" align="left"/> 
      <p>The kids really loved it!</p> 
      <img src="images/rightquote.png" width="32" height="20" alt="right quotation" align="right"/> 
     </div> 

任何幫助/意見將不勝感激！謝謝！！

Answer 1

我不完全確定你的意思是你想在你的段落中的第二個圖像，但我知道一個相當容易和廉價的方式來使用CSS來重新定位你的第二個圖像，你想要的地方... 首先把在圖像上ID：

<img id='image2' src="images/rightquote.png" width="32" height="20" alt="right quotation" align="right"/> 

然後使用CSS來重新定位：

<style> 
#image2 { 
position:relative; 
top:-50px; // These numbers are just examples you can change them to anything to properly reposition your text. 
left:20px; 
z-index:-1; //depending on whether you want your image infront or behind the text you can change your z-index to either a positive number e.g.(5) or negative number e.g.(-2). 
} 
</style> 

如果你擔心在不同的瀏覽器不同的打印格式，他們不會阿帕爾是巨大的差別就在此：放置但有是另一種方式要做到這一點，如果你可以使用溢出在圖像周圍包裝文字。例如：

<div class='floating-eg'> 
<p>The kids really loved it!</p> 
     <img class='left' src="images/rightquote.png" width="32" height="20" alt="right quotation" align="right"/> 
</div> 
<style> 
.floating-eg { 
    overflow: auto; 
} 
p { 
    overflow: auto; 
} 
</style> 

你可以看到一個相關的包裝示例here。