英雄圖片無法在Mozilla上運行

Question

我的英雄形象可以在所有瀏覽器上使用，但不能在Mozilla中使用，我不確定為什么會這樣，因為我使用的是一些通常對我有用的標准代碼。

這是我的完整背景標題圖片的CSS：

  display: table;
  width: 100%;
  min-height: 100vh;
  height:100vh;
  padding: 100px 0;
  text-align: center;
  color: white;
  background: url(../img/intro-bg.jpg) no-repeat bottom center scroll;
  background-color: black;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;

這是現場直播： http : //www.conlamochilaalhombro.com

非常感謝！

Answer 1

簡單的解決方案

去除height: 100%; 來自.intro

替代解決方案

»僅顯示另一種居中文本/內容的方式。

擺脫display: table; 在.introp並display: table-cell; 在.intro-body 。 然后將.intro-body如下所示：

.introp {
    position: relative;
}
.intro-body {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate( -50%, -50% );
}