文本圖像文本內聯HTML CSS

什麼是最好的方式來獲得文本，然後與文本下面的圖像？如果可能的話，我不想使用表格，但是我遇到了打破他們自己的路線的問題。文本圖像文本內聯HTML CSS

下面是我的代碼和CSS至今：

<div id="header_number"> 
    <h2 class="phone_title">Call Us Today!</h2> 
    <img src="images/phone_icon.jpg" alt="Call us Today"/> 
    <h2 class="large_num">1-800-555-9999</h2> 
</div>

CSS：

h2.phone_title{font: 13px arial;Color:#013173;text-align:left;} 
h2.large_num{font:29px arial;Color:#013173;text-align:left;} 
#header_number{float:right;height:60px;width:332px;display:inline;}

我想在div容器（header_number）的display:inline;會樣樣在行了，但沒有奏效。如果需要，我可以添加一個類到img並浮動一切，如果這是我唯一的選擇。

來源

2012-11-14 Denoteone

現在定義您一些元素display:inline-block;或vertical-align:top

像這樣

h2.phone_title, h2.large_num, img 
{display:inline-block;vertical-align:top; 
margin:0; 
}

現在檢查live demo

來源

2012-11-14 04:42:35

偉大的，這正是我正在尋找的。感謝您的幫助，我學會了使用display屬性的正確方法。 – Denoteone

+1並進行檢查。謝謝。 – Denoteone

文本圖像文本內聯HTML CSS

回答

相關問題