0

何らかの理由でli、長いテキストが画像の下に折り返されると、Firefox は画像を上に移動 (バンプ) します。ただし、これは Chrome と Safari では発生しません。画像を参照してください:

クローム/サファリ:

ここに画像の説明を入力

ファイアフォックス:

ここに画像の説明を入力

なぜこれを行っているのかよくわかりません。ここにも私のCSSがあります:

.crew ul li {
display: inline-block;
list-style: none;
margin-left: 30px;
margin-right: 30px;
margin-bottom: 75px;
font-size: 1.1em;
font-style: italic;
color: #71767d;
font-weight: 300;
position: relative;
width: 117px;
height: 117px;
}

.crew ul li img {
-webkit-transition: opacity 0.5s ease-in-out;
-moz-transition: opacity 0.5s ease-in-out;
transition: opacity 0.5s ease-in-out;
position: absolute;
left: 0;
}

.crew ul li img.top:hover {
opacity: 0;
cursor: pointer;
}

.crew ul li p {
margin-top: 120px;
}

ネストされた要素内のすべてのマージンも削除しようとしましたが、それでも間抜けに表示されます。助言がありますか?

4

1 に答える 1