列表項中的div元素的垂直對齊

Question

我有一個像this的佈局。
如果我沒有固定的列表項目或圖像高度，並且同時確保圖像不會相互重疊，如何將每個div.product_image與<li>項目的垂直中間對齊？

Answer 1

一張桌子可以工作，但你不會喜歡它。然後JS可能會有幫助。 「正常」的方式做到這一點需要在<li>中使用min-height & min-width，然後使用2個div。第一個position: absolute; 1px * 1px top:50%;left:50%;，第二個相對格left:-Xpx; top:-Ypx; width:2*X; height:2*Y;（< - 這將是靜態的），然後只需放置任何你想要的東西。