卡背面需要填满整个屏幕

Question

我在jsfiddle（http://jsfiddle.net/GDdtS/3610/）上发现了一张3d卡片，我将其编辑为： http://jsfiddle.net/qCPrj/

我试图让“卡片”的背面填满网页的整个屏幕。有人建议添加代码：

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

到后排，但这不会改变背面的宽度。我的问题是，如何让“卡片”的背面填满整个屏幕？

编辑*

正面尺寸需要保持400px宽和200像素高，但我希望背面是全屏的，所以当鼠标悬停在背面时会出现并扩展以覆盖整个屏幕。

Answer 1

你必须将高度100％设置为所有父元素以相应地填充空间 - 所以在你的情况下添加

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

Jsfiddle

Answer 2

你班级的宽度和高度只有400X200，所以技术上最大......它将填补那部分。你需要增加“.flip”的大小