I’m using Cornerstone flipping cards on a client website and we are having issues in the flip action. Can you please take a look at this page and advise? I have seen some CSS fixes but they are not working well.
Here is the link to the page : https://www.newfi.com/directory-refi/
Below is the code that I tried but took out so you can test cleanly.
.x-card-outer.flipped .x-face-outer.front,
.x-card-outer:hover .x-face-outer.front {
display: none;
}
.x-card-outer .x-face-outer {
height: 194px;
}
}
@media all and (-ms-high-contrast:none)
{
.x-card-outer.flip-3d .x-card-inner{
transition: transform .5s cubic-bezier(0.23, 1, 0.32, 1)
} /* IE10 */
::-ms-backdrop, .x-card-outer.flip-3d .x-card-inner{
transition: transform .5s cubic-bezier(0.23, 1, 0.32, 1)
}/ IE11 */
}
.x-card-outer .x-face-outer {
height: 194px;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.x-card-outer .x-face-outer.back {
display: none;
}
.x-card-outer.flipped .x-face-outer.back {
display: block;
}
.x-card-outer.flip-3d .x-face-outer {
backface-visibility: visible;
}