css - Webkit とは異なる Moz レンダリングの下部プロパティ

Question

このサイトで次の CSS を使用して、ホバー時に H3 を表示しようとしています:

 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;
 }

何らかの理由で、Firefox では Chrome や Safari と同じようにレンダリングされません。ボトム属性に問題があるようです。

Answer 1

何らかの理由で、サファリは「最小幅」を 250px として計算し、Firefox は 100% として計算しています!

したがって、ボックスのレイアウトは、サファリでは 250x100 (OK) ですが、Firefox では 240x50 になります。それが問題かもしれません。その 100% はどこから来ているのでしょうか (おそらく isotope の js ファイルのどこかにあるのでしょうか?)