css - カードの裏面は画面全体に表示する必要があります

Question

jsfiddle ( http://jsfiddle.net/GDdtS/3610/ ) で 3D カードフリップを見つけ、これを編集しました: http://jsfiddle.net/qCPrj/

「カード」の裏側をウェブページの画面いっぱいにしようとしています。誰かがコードを追加することを提案しました:

positition: absolute;
left: 0;
right: 0;

back クラスに追加しますが、これは背面の幅を変更しません。私の質問は、「カード」の裏側を画面全体に表示するにはどうすればよいですか?

編集*

前面のサイズは幅 400 ピクセル、高さ 200 ピクセルのままにする必要がありますが、背面をフルスクリーンにしたいので、マウスオーバーすると背面が表示され、画面全体をカバーするように拡大されます。

score 0 · Accepted Answer

それに応じてスペースを埋めるために、すべての親要素に高さ100％を設定する必要があります-したがって、あなたの場合は追加します

html, body, .flip, .card, .front, .back{height:100%}

score 0 · Accepted Answer

クラスの幅と高さは 400X200 しかないため、技術的には最大で ...その部分を埋めます。「.flip」のサイズを大きくする必要があります

2 に答える 2