0

レストラン用の小さなウェブサイトを開発しているときに、Firefox でのポジショニングに関するこの奇妙な問題に出くわしました - IE と Chrome は問題なく動作します。

URL：カフェサイト

スライダーは次のように配置されます。

#new-royalslider-1{
position: absolute;
top: 0;
left: 0;
z-index: -1

非常に単純ですが、Firefox の動作が異なる理由を理解できる人はいますか?

4

5 に答える 5

1

まず、スライダーを相対的に配置し、ヘッダーラッパーを内部に配置する必要があると思います。絶対位置付け。

それをしたくない場合はposition: relative、スライダーを使用して、ヘッダーラッパーを使用して次のことができます

position: absolute;
top: 0;
于 2013-05-02T07:54:38.783 に答える
0

どうやら.headerセレクターに混乱があるようです。デバッグ モードで 2 回表示され、Firefox で使用されているものとまったく同じではありません。

Firefox では、このルールのチェックを外すと問題が解決します。

.header {
    ...
    ...
    border-bottom: medium none;
}

何らかの理由で、クロムは言及されていませんmedium。お役に立てれば

于 2013-05-02T08:08:47.747 に答える
0

すべてのブラウザが Web サイトを同じように表示するわけではなく、全体が統一される傾向にあるとしても、いずれかによって誤解される詳細な点がまだいくつかあります。

問題は、Firefox、Opera、および Safari には、Internet Explorer のように、特定のコメントを含む個別のスタイル シートを割り当てる方法がないことです。

おそらく、ブラウザをターゲットにすることで問題が解決するでしょう。次のコードを追加します。

@-moz-document url-prefix()
{
    #new-royalslider-1{
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1
}
于 2013-05-02T08:07:14.150 に答える
0

理由はわかりませんが、html が切り捨てられているようです。だから、私は火事でした: html{float: left}. それが役に立てば幸い。

于 2013-05-02T07:54:34.813 に答える
0

ID #header-wrapper position absoluteを次のように定義します

#header-wrapper{position:absolute;top:0;}

あなたのID を次のように定義します#wrapper margin-top: 450px; 

#wrapper {
    margin-top: 450px;
}
于 2013-05-02T07:54:44.910 に答える