無法使文字與圖像對齊？

Question

問題：我想將文本與圖像對齊。意思是，我想文字在中間。

<div style="margin-top:0px"> 
 
    <p style="margin-top:2px"> 
 
     <img src="images/pdf-icon-24.png" alt="Dermatology_Referral_Guidelines" class="float-left" /> 
 
     <a href="Downloads/PhyDownloads/Dermatology_Referral_Guidelines.pdf" target="_blank">Dermatology Referral Guidelines</a> 
 
    </p> 
 
</div>

Answer 1

在<img>使用vertical-align: middle;。

**注意，這隻適用於單行文本。

img { 
 
    vertical-align: middle; 
 
}

<p> 
 
    <img src="http://placehold.it/200x40/fc0"> 
 
    Some text here. 
 
</p> 
 

 
<p> 
 
    <img src="http://placehold.it/200x40/fc0"> 
 
    Topsail broadside handsomely draught interloper aye killick prow lugsail execution dock. Man-of-war spike Sea Legs clap of thunder tender belay ho parley grapple heave to. 
 
</p>

注：我的假設是，文本應該是在同一行/線作爲圖像，而不是在它下面。含義與圖像的y軸的中間對齊，而不是圖像的x軸。