Div圖像和文本對齊

我有一個橫幅在我設計的網站的首頁底部運行。橫幅分爲4個相同的部分。每個部分（div）由兩個部分（div）組成。其中一部分是圖像，而另一部分是文字。我希望所有包含div的圖像與其各自的文本div水平對齊。這是一個例子的鏈接。Div圖像和文本對齊

http://dl.dropbox.com/u/22196024/Banner-Test/banner-test.html

在此先感謝您的幫助！

P.S.另外，爲什麼傢俱和設備盒的寬度與耗材和打印盒不同？謝謝！

[更新]我也很抱歉，因爲你可能會告訴我更像一位開發者的設計師。

來源

2012-01-04 John

我不確定你的問題到底是什麼。此外，傢俱和設備是不同的，因爲圖像是不同的大小，因此佔用不同的空間。 – Ktash 2012-01-04 02:54:50

例如，我希望訂書機水平居中，包含標題和說明的div。 – John 2012-01-05 01:41:02

你的意思是居中*垂直*嗎？ – Wex 2012-01-05 01:59:43

您的代碼不正確。

而不是

<div class="one_fourth first"> 
     <div class="iconbox"> 
      <span class="iconbox_icon"> 
       <img src="furniture-icon.png" alt=""> 
      </span> 
      <div class="iconbox_content"> 
       <h3 class="iconbox_content_title">Furniture</h3> 
       <p>Lorem ipsum dolor sit amet.</p> 
      </div> 
     </div> 
    </div>

你可以這樣做：

<div class="box box1"> 
    <h3>My h3 title</h3> 
    <p>Lorem ipsum</p> 
</div>

和風格它的CSS，設置每個盒子的背景圖像。

來源

2012-01-04 07:56:14 Bernat

它們被限制爲這種格式，因爲它是一個WordPress插件，可以這樣生成它。我只是試圖以某種方式來設計它。 – John 2012-01-05 01:40:03

您可以將圖像完全放置在相對位置的父級（'div.iconbox'）內，以使它們像背景圖像一樣。 – powerbuoy 2012-01-05 06:15:15

@powerbuoy解決方案是一個很好的解決方案 – Bernat 2012-01-05 08:55:33

Div圖像和文本對齊

回答

相關問題