Chrome版本62.0.3202.94 3d问题渲染

Question

任何人都可以帮我解决我在上一版Chrome上发现的问题吗？     我发现Chrome新版本在3D中的DIV背景方面存在问题。     在Chrome版本61.0.3163.100中，相同的页面呈现得很好。     在Safari，Internet Explore，Edge和Firefox上，页面呈现没有任何问题。     我在此消息中附加了原始HTML页面的一小部分，以显示哪个是问题。     提前致谢

Andrea Angeli

＆＃13;

＆＃13;

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1.42857143;
  color: #333;
  background-color: #fff;
}

.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

.corr-container {
  text-align: center;
  position: relative;
}

.cube {
  -moz-perspective: 600px;
  perspective: 600px;
  -webkit-perspective: 600px;
  position: relative;
  width: 100%;
  display: inline-block;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
}

.cube {
  height: 550px;
  perspective-origin: 50% 275px;
  -webkit-perspective-origin: 50% 275px;
}

.cube-face-top {
  left: 0;
  width: 100%;
  height: 3300px;
  transform: rotateX(-90deg);
  -webkit-transform: rotateX(-90deg);
  transform-origin: center top;
  -webkit-transform-origin: center top;
  background-image: url(https://www.trulytaly.com/ElementiGrafica/Corridoi/Nuovi/Soffitto.png);
  background-size: 100% 550px;
  -webkit-background-size: 100% 550px;
}

.cube-face {
  position: absolute;
  top: 0;
}

.plaza-face-top {
  background-repeat: no-repeat;
  background-image: url(https://www.trulytaly.com/ElementiGrafica/Piazze/NuoviFilePiazza/CUT-FOTOGALLERIA2-B2-TOP.jpg);
  width: 100%;
  height: 550px;
  background-size: 100% 550px;
  position: absolute;
  top: 100%;
}

.plaza-face,
.r-plaza-face {
  position: absolute;
  top: 0;
}

.plaza-face,
.r-plaza-face {
  position: absolute;
  top: 0;
}

.rplaza-face-top {
  background-repeat: no-repeat;
  background-image: url(../ElementiGrafica/Piazze/NuoviFilePiazza/CUT-FOTOGALLERIA2-B2-TOP.jpg);
  width: 100%;
  height: 550px;
  background-size: 100% 550px;
  position: absolute;
  top: -550px;
}

.dropdown-flag {
  position: relative;
  display: inline-block;
}

.dropdown-content-flag {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  padding: 12px 16px;
}

.dropdown-flag:hover .dropdown-content-flag {
  display: block;
}

.col-sx-dx-div-principale {
  display: none;
  width: 0;
  height: 0;
}

@media screen and (min-width: 1900px) {
  .div-principale {
    max-width: 90%;
    position: relative;
    float: left;
  }
  .col-sx-dx-div-principale {
    display: block;
    position: relative;
    float: left;
    background-color: white;
    transform-style: preserve-3d;
    transform: translateZ(20000px);
    z-index: 9999999;
    height: 900px;
    width: 5%;
  }
}


}

＆＃13;

<div class="div-principale" style="margin: 0 auto; padding: 0;">
  <div class="container-fluid" style="padding: 0px;">
    <div style="padding-right:0px;padding-left:0px;" class="virtual-container">
      <div class="corr-container">
        <div class="cube-container">
          <div id="cube" data-inverted="false" class="cube" data-p="front">
            <div class="cube-face ct cube-face-top">
              <div class="pt plaza-face plaza-face-top"></div>
              <div class="pt plaza-face rplaza-face-top" style="display:none"></div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;