css3 flip card di chrome lancar di firefox kok gini ya?

dikelas https://sekolahkoding.com/kelas/belajar-css3/video/membuat-kartu-part2 nyoba pake chrome "belajar" bisa terhidden ketika hover, tapi pake firefox kok belajarnya gak mau ke hidden udah nyoba clear cache gak ngaruh juga

kodenya

<!DOCTYPE html>
<html lang="eng">
  <head>
    <meta charset="UTF-8">
    <title>Belajar css 3</title>
    <style>

      body{
        margin-bottom: 500px;
        margin-left: 50px;
        font-size: 20px;
        color: white;
      }

      #card{
        position: relative;
        background: blue;
        height: 200px; width: 200px;
        transition: transform 2s;
        border: 2px solid black;
        transform-style: preserve-3d;
      }

      #front, #back{
        position: absolute;
        top: 0px;
        left: 0px;
        height: 200px; width: 200px;
        backface-visibility: hidden;
      }

      #back{
        transform: rotateY(180deg);
      }

      #card:hover{
        transform: rotateY(180deg);
      }
    </style>
  </head>
  <body>

    <h1> Flip Card </h1>
    <div id="box">
        <div id="card">
          <div id="front"> Belajar </div>
          <div id="back"> CSS 3 </div>
        </div>
    </div>

  </body>
</html>

css

@yudistirasd

42 Kontribusi 11 Poin

Dipost 8 tahun yang lalu

Belum ada Jawaban. Jadi yang pertama Jawaban

Kelas Premium! Belajar bikin website dari nol sekarang

css3 flip card di chrome lancar di firefox kok gini ya?

Kelas Premium!
Belajar bikin website dari nol sekarang