html - 画像ブロックを中央に垂直に配置

Question

ページの中央に画像を配置する必要があります。margin:auto を使用して中央を水平に揃えました。

div ブロックの中央を垂直に揃えるにはどうすればよいですか。以下の条件があります。

1. divまたは画像の幅と高さについては言及できません。

2. margin-top をピクセル単位で使用できません。

これが私のjsfiddleです。

Answer 1

あなたはそれをほぼ正しく行っていました。これが固定フィドルです http://jsfiddle.net/joplomacedo/cDD7m/4/

問題は、テーブルセルが想定どおりに動作するために、要素をdisplay: tableラップする必要があるということです。display: table-cell

Answer 2

背景画像のテクニックはあなたのニーズに合っていますか?

background: url(my-image.jpg) center center no-repeat;