莫茲元件上呈現高度不同於Webkit的

Question

嘗試使用以下CSS在此site顯示懸停的H3：由於某些原因，這是不呈現相同的Firefox

a > h3 { 
    min-width: 100% !important; 
    min-height: 100px; 
    max-height: 100px; 
    display: block; 
    position: absolute; 
    bottom: -80px; 
    color: #FFF; 
    padding: 25px 5px; 
    box-sizing: border-box; 
    -webkit-transition: all 300ms ease-in; 
    -moz-transition: all 300ms ease-in; 
    -ms-transition: all 300ms ease-in; 
    -o-transition: all 300ms ease-in; 
    transition: all 300ms ease-in; 

    a:hover > h3 { 
    bottom: 0; 
    } 

，因爲它是在瀏覽器和蘋果瀏覽器。當min-height設置爲100px時，它在Chrome和Safari中運行良好，當它設置爲50px時，它在Firefox中正常工作。

Answer 1

它可能是因爲火狐（如版本的20.0.1）仍然需要爲box-sizing財產-moz供應商名稱，只需添加：

-moz-box-sizing: border-box;