flip cards перестало работать в хроме

[seokotov]

Раньше все работало а тут вдруг в chrome перестало
если быть точнее фотка при наведении вращается но задняя сторона не отображается
в других браузерах работает как раньше
подскажите где копать?

    <div class="col-12 col-sm-6 col-md-6 col-lg-4">
        <div class="dating-image">
		<div class="flip-card"><div class="flip-card-inner">
           <a href="[[+uri]]"> <div class="flip-card-front">
			<img loading="lazy" style="border-radius: 8px; border: 1px solid black;" src="[[+content:get_first_image:contains=`lock-unlock-01-icon-png-icon.jpg`:then=` [[getImageList? &tvname=`content_block_slideshow` &tpl=`stels` &limit=`1` &idx=`1` &docid=`[[+id]]`]]`:else=`[[+content:get_first_image:pthumb=`w=232&h=298&zc=t`]]`]]" alt="">
			</div>
			<div class="flip-card-back">
            <p>[[+introtext]]</p>
            </div> 	</a>		  
        </div></div>
		</div>
        <div class="dating-id text-center">[[+pagetitle]]</div>
    </div>

в css вот такое

.flip-card {
  background-color: transparent;
 width: 234px;
  height: 300px;
  border: 1px solid #f1f1f1;
  border-radius: 8px;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
  margin:0 auto;
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden; /* Safari */
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
border-radius:8px;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: #fff;
  color: black;
}
.flip-card-front img {
  width:234px;
  max-width:234px;
  height:300px;
  max-height:300px;
}
/* Style the back side */
.flip-card-back {
  background-color: #6281c8;
  color: white;
  display:flex;
  transform: rotateY(180deg);
}


.flip-card-back p{color:#fff;}

[seokotov]

как я понял тег a влиял странно но факт