小编Cal*_*lle的帖子

我正在尝试翻转CSS卡以在所有浏览器上正常工作。我已经将它用于除Safari之外的所有功能。我使用了以下代码：

/* entire container, keeps perspective */
.flip-container {
     perspective: 1000;
     transform-style: preserve-3d;
     display: inline-block;
}

/*  UPDATED! flip the pane when hovered */
.flip-container:hover .back {
     transform: rotateY(0deg);
}
.flip-container:hover .front {
    transform: rotateY(180deg);
    backface-visibility: hidden; 
}

.flip-container, .front {
     width: 250px;
     height: 250px;
}

.flip-container, .back {
     width: 250px;
     height: 250px;
}

 /* flip speed goes here */
 .flipper {
     transition: 0.6s;
     transform-style: preserve-3d;
     position: relative;
}

 /* hide back of pane during swap */
.front, .back { …

我一直试图在这个页面链接上集中几个iframe .但是,我看到的每个例子我都尝试过但不起作用.您可以清楚地看到不居中的视差浮动div,在底部,html页面的iframe向右浮动而不是居中.

任何帮助将非常感激.