产品中间与div对齐？

Question

我的网店上有各种各样的产品。假设我有三张产品图片，大小调整后：

100 x 20
100 x 100
100 x 180

100 x 180是产品窗口可以采用的最大尺寸。为了获得完美的产品放置，我需要将所有这三个图像放到100 x 180的窗口中。这不是很困难：

<div class="products" style="height: 180px;">
 <div class="product1">
   <img src="prod1.jpg" />
 </div>
 <div class="product2">
   <img src="prod2.jpg" />
 </div>
 <div class="product3">
   <img src="prod3.jpg" />
 </div>

现在，问题在于这些图像都在顶部对齐。我需要它们都是MIDDLE对齐的，就像表格那样。我可以很容易地用表格来做这件事，但我对如何用CSS做错了。它是简单的CSS还是有一个漂亮的JQuery插件这样的东西？

Answer 1

.products div { line-height: 180px; }

...尽管理想情况下你应该使用某种类型的列表而不仅仅是div。