JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    <div class="ob3d">Error occurs between -0.5deg and 0.5deg on firefox 32.0.2</div>
</div>

CSS

html,body{
     height: 100%;
}
.box{
    perspective: 1000px;
    width: 80%;
    height: 80%;
    margin: 10%;
    border: 1px rgba(0,255,0,0.2) dashed;
}
.ob3d{
    width: 100%;
    height: 100%;
    transform: rotateX(0.5deg);
    background: rgba(255,0,0,0.5);
    transform-origin: 50% 100% 0;
    outline: 1px transparent solid;
    animation: bounce 5s linear infinite;
}
@keyframes bounce{
  0%   { transform: rotateX(-20deg);}
  50% { transform: rotateX(20deg);}
  100% { transform: rotateX(-20deg);}
}