0

問題はこのページにあります: http://www.matternow.com/portfolio/

サムネイルのいずれかをクリックすると、オーバーレイの左下にある画像のタイトルがその上の境界線に近すぎることがわかります。これは、Chrome (および他のすべてのブラウザー) で問題なく表示されます。bottom: 0; に設定されている要素の CSS を無視しているようです。

ちなみに、これはブラウザのハッキングです。次のようになります。

#portfolio-overlay #cboxTitle{
        font: bold 21px 'Crimson Text', serif !important;
        position:absolute;
        bottom: 8px;
        top: auto;
        left: 10px;
        color:#000;
    }

@media screen and(-webkit-min-device-pixel-ratio:0) {
    #portfolio-overlay #cboxTitle {
        bottom: 0;
    }
}

なぜこれが起こっているのか知っている人はいますか?つまり、Chromeで見栄えが良いので、Safariでも見栄えがするはずですよね?

4

1 に答える 1

1

ハックが必要な理由はわかりません。元の値を 0 に設定できないのはなぜですか?

とにかく、メディア クエリの「and」の後にスペースがありません。http://www.w3.org/TR/css3-mediaqueries/#syntax example #20を参照してください。

于 2013-04-08T20:11:36.460 に答える