0

この画像を正しく表示するのに少し問題があります。

サイトの幅を 940px に設定しており、この幅を維持したいのですが、この幅より広くオーバーフローする div があり、大きなディスプレイでもこれを見ることができます。

<div id="cinema-wrapper">
<div id="cinema-displays"></div>
</div>


#cinema-wrapper {
width:940px; 
height:764px;
}
#cinema-displays {
background-image: url(../mackbyte_files/img/cinema-bg.png);
height: 764px;
width: 3109px;
background-repeat: no-repeat;
position: absolute;
left:50%;
margin-left:-1554.5px;
overflow:visible !important;
}

これは（ちょっと）うまくいきますが、2つの問題が残っています。

  1. Safari では動作しません (chrome/firefox は問題ありません)。
  2. 右にのみスクロール オプションを残します。(たとえば、さらに右にスクロールして、オーバーフローした画像を表示できます)。

2 については、画面の解像度に応じて画像の量をユーザーに表示するだけです。

PS。3109px が Web と画面の解像度にとって巨大であることは知っていますが、画像を小さくするために続行する前に修正に取り組んでいます。ただし、そうすると、まだこの問題が発生します。

4

2 に答える 2

0

内側の div が表示されるか、シネマ ラッパーの外側に表示されないかを制御するのは、設定していない親のオーバーフローです。だから、あなたはすべきです

#cinema-wrapper {
    width:940px; 
    height:764px;
    overflow:visible;
}
于 2013-02-02T19:31:21.933 に答える